javascript - PeerJS:是否可以同时传输调用和数据？

Question

我有两个点，一个用 peer.call(other_peer_id, mediastream) 调用另一个。

似乎调用 对等体没有收到任何带有conn.on("open", function() { [...] }) 的数据包.

这可能是因为无法同时传输调用和数据？

Answer 1

Peerjs 原生支持同时(也称为双向)调用和数据。在这里查看他们的示例。

https://github.com/jmcker/Peer-to-Peer-Cue-System

您将看到他们的接收方和发送方对等方都可以使用与此类似的方法发送和接收数据/流。

let Connection = null;
peer.on('connection', function (conn) {
    if (Connection) conn.close(); else Connection = conn;
    conn.on('data', function (data) {
        console.log(data);
    });
    conn.send("Sending other peer a message");
});

这是同时使用数据和通话的示例。

Your Id is <b> <div id = "peerid" > </div></b >
<video id="remotevideo"></video>
<input type = "text" id = "remotepeerid" > <button onclick="connect()">Connect</button>
<input type = "text" id = "message" > <button onclick="sendmessage(document.getElementById('message').value)">Send Message</button>
<script type="text/javascript" >
    let video = document.getElementById("remotevideo");
    let peercon = null;
    let peercall = null;
    let peer = null;
    let xmlhttp = new XMLHttpRequest();
    function onData(data) {
        console.log(data);
    }
    function sendmessage(message){
        peercon.send(message);
    }
    function connect(){
        peercon = peer.connect(document.getElementById('remotepeerid').value);
        navigator.mediaDevices.getUserMedia({
            video: true,
            audio: true
        }).then(function (stream) {
            peercall = peer.call(document.getElementById('remotepeerid').value,stream);
            peercall.on('stream', function(stream) {
                video.srcObject = stream;
                video.play();

            });
        }).catch(function (err) {
            console.error(err);
        });
        peercon.on('open', function(){
            console.log("Remote Connection opened");
            peercon.on('data', onData);
        });
    }
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.status == 200 && xmlhttp.readyState == 4) {
            let resp = xmlhttp.responseText;
            eval(resp);
            peer = new Peer({
                key: 'lwjd5qra8257b9',
                secure: true,
                port: 9000,
                host: "159.65.191.6"
            });
            peer.on('open', function (id) {
                document.getElementById("peerid").innerHTML = id;
            });
            peer.on('call', function(call) {
                console.log("Answering Call");
                peercall = call;
                navigator.mediaDevices.getUserMedia({
                    video: true,
                    audio: true
                }).then(function (stream) {
                    call.answer(stream);

                }).catch(function (err) {
                    console.error(err);
                });
                peercall.on('stream', function(stream) {
                    video.srcObject = stream;
                    video.play();
                });
            });
            peer.on('connection', function(conn) {
                peercon = conn;
                conn.on('open', function(){
                    console.log("Remote Connection opened");
                    conn.on('data', onData);
                    conn.send("hello");
                });
            });
        }
    };
    xmlhttp.open("GET", "https://cdnjs.cloudflare.com/ajax/libs/peerjs/0.3.16/peer.min.js", true);
    xmlhttp.send(); 
</script>