Cannot preview an image within chatroom

[KelvinHUNG11]

Hi there, I am a beginner in chatroom development. I am now using the vue-advanced-chat for my development.
It's a really good and user-friendly module for me.
But I faced a difficulty which drags me for days to be resolve, so I try to post it here for help. Your help is appreciated.

Here is the story, I tried to send an image to a chatroom and wanna preview it, however, it failed. Below is the frontend return msg.
The image I sent is :
https://firebasestorage.googleapis.com/v0/b/vuexfire-a9c43.appspot.com/o/files%2F6R0MijpK6M4AIrwaaCY2%2F5RM2yf2TBCVmAUpaHbCD%2Fimage.png?alt=media&token=141dc7d8-1665-438b-871e-6e8566fabd2c

**** msg successfully sent out and received through vue-socket.io ****

**** cannot preview in the chatroom at sender's side ****

**** cannot preview in the chatroom at receiver's side ****

May I know if there is anyone can help? thanks.

[antoine92190]

Why do you pass audio: true to the file?
Image files should look like this:

{
  name: 'My Replied File',
  size: 67351,
  type: 'png',
  url: 'https://firebasestorage.googleapis.com/...'
}

[KelvinHUNG11]

thanks for pointing out, I removed it and tried again. However, the same issue is still existed.
I have set the "media-preview-enabled" = true

Below is the msg record after removing the redundant attributes.

****msg successfully sent out and received through vue-socket.io ****

**** cannot preview in the chatroom at receiver's side ****

[antoine92190]

Your file object looks stringified. Make sure it's an object, and not the string of an object

[KelvinHUNG11]

thanks for pointing out!! It works now