# Send image throw session.signal

**URL:** <https://openvidu.discourse.group/t/send-image-throw-session-signal/1910>\
**Category:** Issues developing apps\
**Tags:** v2\
**Created:** [August 26, 2020, 9:25am UTC](https://openvidu.discourse.group/t/send-image-throw-session-signal/1910 "2020-08-26T09:25:02Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Timor\_Sulimani](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/timor_sulimani/32/841_2.png) [@Timor\_Sulimani](https://openvidu.discourse.group/u/Timor_Sulimani)\
**Post date:** [August 26, 2020, 9:25am UTC](https://openvidu.discourse.group/t/send-image-throw-session-signal/1910/1 "2020-08-26T09:25:02Z")

</div>

I have react-native app.  
**Chat messages works fine between two devices with:**  
session.signal({  
data: JSON.stringify(data),  
to: [],  
type: ‘my-chat’,  
})

But how can i send image?  
I tried with formData, no success.

---

<div class="post-metadata">

**Author:** ![mihailj](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/mihailj/32/406_2.png) [@mihailj](https://openvidu.discourse.group/u/mihailj)\
**Post date:** [August 26, 2020, 9:42am UTC](https://openvidu.discourse.group/t/send-image-throw-session-signal/1910/2 "2020-08-26T09:42:20Z")

</div>

Don’t use signaling for this, it’s pretty restricted.  
You need to use [WebRTC data channels](https://webrtc.github.io/samples/src/content/datachannel/filetransfer/). I think that they can be hooked easily to the exposed `RTCPeerConnection` (through `event.stream.getRTCPeerConnection()`).

---

<div class="post-metadata">

**Author:** ![rohit.roy](https://avatars.discourse-cdn.com/v4/letter/r/eada6e/32.png) [@rohit.roy](https://openvidu.discourse.group/u/rohit.roy)\
**Post date:** [August 26, 2020, 12:25pm UTC](https://openvidu.discourse.group/t/send-image-throw-session-signal/1910/3 "2020-08-26T12:25:32Z")

</div>

@Timor_Sulimani, I think you should convert the image into base64 and then try to send the data using signalling. @ receiver side converts a base64 encoded image string into an image.

---

<div class="post-metadata">

**Author:** ![mihailj](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/mihailj/32/406_2.png) [@mihailj](https://openvidu.discourse.group/u/mihailj)\
**Post date:** [August 26, 2020, 2:38pm UTC](https://openvidu.discourse.group/t/send-image-throw-session-signal/1910/4 "2020-08-26T14:38:09Z")

</div>

This will work only for very small images otherwise the Websocket connection will fail:

> Connection Closed: 1009 The decoded text message was too big for the output buffer and the endpoint does not support partial messages

This was also discussed here: [Websocket reconnects after sending large signal](https://openvidu.discourse.group/t/websocket-reconnects-after-sending-large-signal/1562)

Also take in consideration that base64 encoding will increase the file size with 33%.

But now that I think better my solution would also probably fail because the peer connection is done with the KMS server - unless it does the data channel relaying.

---

<div class="post-metadata">

**Author:** ![micael.gallego](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/micael.gallego/32/2_2.png) [@micael.gallego](https://openvidu.discourse.group/u/micael.gallego)\
**Post date:** [August 26, 2020, 5:26pm UTC](https://openvidu.discourse.group/t/send-image-throw-session-signal/1910/5 "2020-08-26T17:26:01Z")

</div>

The best way is sending the image to the backend and then downloading it from clients.

---

<div class="post-metadata">

**Author:** ![rohit.roy](https://avatars.discourse-cdn.com/v4/letter/r/eada6e/32.png) [@rohit.roy](https://openvidu.discourse.group/u/rohit.roy)\
**Post date:** [August 27, 2020, 4:19am UTC](https://openvidu.discourse.group/t/send-image-throw-session-signal/1910/6 "2020-08-27T04:19:13Z")

</div>

@mihailj, Yes you are right and i too think the best and optimised way is to instead of sending the actual image, upload the image to the backend and **just send the image URL through signalling** which @micael.gallego has suggested.

---

<div class="post-metadata">

**Author:** ![Timor\_Sulimani](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/timor_sulimani/32/841_2.png) [@Timor\_Sulimani](https://openvidu.discourse.group/u/Timor_Sulimani)\
**Post date:** [August 27, 2020, 5:06am UTC](https://openvidu.discourse.group/t/send-image-throw-session-signal/1910/7 "2020-08-27T05:06:11Z")

</div>

> [@micael.gallego](#):
>
> ding it from clients.

well, I tried it before,there is a little problem.

I’ll show you a piece of code and explain after.

sendMessage = (data) =\> {  
const { session } = this.state;  
const formData = this.createDataForServer(data);  
const dataForSocket = this.createDataForSocket(data);  
session.signal({  
data: JSON.stringify(dataForSocket),  
to: ,  
type: ‘my-chat’,  
})  
.then(async () =\> {  
console.log(‘Message successfully sent’);  
try {  
**await ApiService.sendMessage(formData);**  
} catch (err) {  
console.log(‘error in sendMessage’, err);  
}  
})  
.catch(error =\> {  
console.error(error);  
});  
}

Now, see this line:  
**await ApiService.sendMessage(formData);**  
This is happenning after the message sent throw the socket,  
that means that if i’ll place the get Messages here:  
mySession.on(‘signal:my-chat’, (event) =\> {  
**ApiService.getMessages()**  
}  
It get called before the sendMessage function,  
Because of this, I will not get the last message.

---

<div class="post-metadata">

**Author:** ![mihailj](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/mihailj/32/406_2.png) [@mihailj](https://openvidu.discourse.group/u/mihailj)\
**Post date:** [August 27, 2020, 8:27am UTC](https://openvidu.discourse.group/t/send-image-throw-session-signal/1910/8 "2020-08-27T08:27:56Z")

</div>

The logic should be reversed, something like:

```auto
(async () => {
    await ApiService.sendMessage(formData);
    // send signal
    session.signal({
    ...
})();

```

---

<div class="post-metadata">

**Author:** ![Timor\_Sulimani](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/timor_sulimani/32/841_2.png) [@Timor\_Sulimani](https://openvidu.discourse.group/u/Timor_Sulimani)\
**Post date:** [August 27, 2020, 8:36am UTC](https://openvidu.discourse.group/t/send-image-throw-session-signal/1910/9 "2020-08-27T08:36:38Z")

</div>

Yes. That’s what i did, works perfect.