Using the existing WebRTC Channel to send custom data between two people

Developers
#1

For a research project I want to modify jitsi and add some functionality.

My goal is to use the existing WebRTC Channel to send custom data between two people. But I struggle to find the Webbrowser implementation, I only find react native related code to webRTC or RTCPeerConnection.

I couldn’t find any documentation about it. Can someone point me to the right direction?

Best regards

#2

Checck the sendEndpointMessage function in JitsiConference.

1 Like
#3

Thank you for the response. How do I react to the message on another client?

I also get an error when executing this method. I tried:

...
import conference from '../../../../conference';
...
const sendData = data => {
    console.log("Sending Data", data);
    console.log("conference",conference);

    try {
        conference && conference.sendEndpointMessage("", {
            name: "ENDPOINT_TEXT_MESSAGE_NAME",
            text: "message"
        });
    } catch (error) {
        console.log("myerror123",error);
    }
}

when executing this on a button click I get

myerror123 TypeError: V is undefined
    sendEndpointMessage https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:150
    Z https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:145
    f https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    w https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    E https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    E https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    D https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    x https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    A https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    jn https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    ce https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    Dn https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    Pn https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    An https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    unstable_runWithPriority https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:259
    Vr https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    se https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    xn https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    Sn https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    En https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    zn https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    Hn https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    gl https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    fl https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    hl https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    il https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    Kr https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    unstable_runWithPriority https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:259
    Vr https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    Kr https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    Gr https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    el https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    enqueueSetState https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:251
    setState https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:235
    _navigate https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:135
    _navigate https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:135
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    promise callback* https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
    <anonymous> https://0.0.0.0:8443/libs/app.bundle.min.js?v=139:400
#4

When using following code.

window.APP.conference.sendEndpointMessage("",{test:"hi"})

I get no error, but I struggle to find documentation for the other end, where I can register an listener or similar.

#5

The only way I managed to get something to another participant was via:

import conference from '../../../../conference';
...
conference.commands.addCommandListener("sendCommand",function(){console.log("command received")});

window.CONF = conference;

Executing in devtools console:
window.CONF.commands.sendCommand("sendCommand",{tagename:"jo"},"h2i")

but when I execute the same command/tagname, I get no “command received” on the second request, only if I alternate between 2 tags, I get everytime a “command received”.

I guess commands are batched so a command doesn’t get executed twice?

I know that sendEndpointMessage was suggestes, but as stated above I was not able to receive a message (perhaps because I couldn’t find the right way to do it)

Best regards

Edit: I also just noticed, that commands seem not to carry any payload information

    conference.commands.addCommandListener("sendCommand",(data)=>{
            console.log(data,"send command listener")
        });

Screenshot from 2022-01-14 11-57-40
Screenshot from 2022-01-14 11-57-40893×201 23.4 KB