我无法使用 peerjs Webrtc 在 Safari 浏览器上接收或发出视频流

Question

我已经设置了他们为 peerjs 提供的示例，在我的 chrome 电脑上运行良好，但我有 ipad pro 和 safari v12，只给我本地流，但不将答案发送给发送者对等

这是我的发件人客户端

const peer = new Peer('sender', { host: '100.0.0.98', port: 9000, path: '/',debug: 3 })
var call = document.getElementById('call');
call.addEventListener('click', startChat);


function startChat (){
    navigator.mediaDevices.getUserMedia({
        video: true
    }).then(function(localStream) {
        document.getElementById('local').srcObject = localStream;
        const call = peer.call('receiver', localStream);
        call.on('stream', function(remoteStream) {
            document.getElementById('remote').srcObject = remoteStream;
        });
    });

}

这是我的接收器

const peer = new Peer('receiver', { host: '100.0.0.98', port: 9000, path: '/', debug: 3 })
// var debugElement = domcument.getElementById('debug');




peer.on('call', function (call) {

    var conf = confirm('Some one is calling you...')

    if (conf) {

        navigator.mediaDevices.getUserMedia({
            video: true
        }).then(function (localStream) {
            document.getElementById('local').srcObject = localStream;
            call.answer(localStream);
            call.on('stream', function (remoteStream) {
                document.getElementById('remote').srcObject = remoteStream;
            });
        }).catch(function (error) { console.log(error); });
    }

});




peer.on('error', function (err) {
    var node = document.createElement("LI");                 // Create a <li> node
    var textnode = document.createTextNode(err);         // Create a text node
    node.appendChild(textnode);                              // Append the text to <li>
    document.getElementById("debug").appendChild(node);     // Append <li> to <ul> with id="myList"
});

这是我的服务器

var express = require('express');
var app = express();
var ExpressPeerServer = require('peer').ExpressPeerServer;
var ip = require('ip');
var fs = require('fs');

app.use(express.static(__dirname + '/public'));


var options = {
    debug: true
}

var sslOptions = {
    key: fs.readFileSync('ssl/key.pem', 'utf8'),
    cert: fs.readFileSync('ssl/cert.pem', 'utf8')
  };

var server = require('https').createServer(sslOptions,app);
var peerserver = ExpressPeerServer(server, options);

app.use('/scripts', express.static(`${__dirname}/node_modules/`));
app.use(express.static('public'));

app.get('/sender', function (req, res, next) { 
    // res.render('sender.html');
    // res.header("Access-Control-Allow-Origin", "*");
    // res.header("Access-Control-Allow-Headers", "X-Requested-With");
    res.sendFile(__dirname + '/public/sender.html');
});

app.get('/recived', function (req, res, next) { 
    // res.render('sender.html');
    // res.header("Access-Control-Allow-Origin", "*");
    // res.header("Access-Control-Allow-Headers", "X-Requested-With");
    res.sendFile(__dirname + '/public/recived.html');
});


app.use('/', peerserver);



server.listen(9000,ip.address(),()=>{
    console.log(`server peer on ${ip.address()}:9000`);
});

我正在使用 peerjs v0.3.20 有人可以帮助我吗，非常感谢

Answer 1

Peerjs 使用了一个基于回调的已弃用 api，您可以在 https://developer.mozilla.org 上看到它，但它是一个未解决的问题 https://github.com/peers/peerjs/issues/485

Answer 2

我在与可能的类似情况作斗争后发现了这一点。

对于 Safari，您必须等到对等连接打开后才能开始进行诸如拨打电话之类的操作。 Chrome 似乎不需要发生这种情况。

所以我有...

var id_peer="thePeerIDSomeoneElseSentUs";

// Create own peer object with connection to shared PeerJS server
//this ID doesn't get used
peer = new Peer();

//HAVE to wait for connection to be opened before we try passing through our stream.  Was needed for Safari!
peer.on('open', function (id) {

    //request our media stream with the constraints defined above
    navigator.mediaDevices.getUserMedia(constraints)
    .then(function(stream) {

        //save for ourselves so we can mute or end the stream later
        stream_self=stream;

        //make the call with the id we've been sent
        //if a video call, we're already viewing our own stream so no need to re-view it
        //we pass our media stream through to the call
        peer_call = peer.call(id_peer,stream_self);

        //when the call is answered we'll be passed back the other person's stream
        peer_call.on('stream', (remoteStream) => {


            stream_remote=remoteStream;

            //your code for playing the remote stream
        });

        peer_call.on('close',call_end);

        peer_call.on('error', function(err) { 
            console.log(err);
        });

    })
    .catch(function(err) {
        console.log(err);
    });        

});

peer.on('close', call_end);
peer.on('error', function (err) {
    console.log(err);
});