Question

我想让navig.html中的Alice能够使用实时视频流在index.html中调用Seb。

但是在index.html文件中，我无法在index.html文件中显示Alice的远程直播流，因为视频播放器什么也没显示。为什么？

这是Alice，她有报价（navig.html）

<video id="video1" controls ></video>

<script>

navigator.getUserMedia({audio:true, video:true}, success, error);


function success(stream) {
    var video1 = document.querySelector("#video1");
    video1.src = URL.createObjectURL(stream)
    video1.play()
    //rtcpeer
    console.log("1")
    var pc1 = new RTCPeerConnection()
    pc1.addStream(stream)
    pc1.createOffer().then(function(desc) {
        pc1.setLocalDescription(desc)
        console.log("" + JSON.stringify(desc))
    })
}
function error(err) {
    console.log(err)
}



</script>

这是Seb，他希望使用其优惠（index.html）

接收Alice的直播

<video id="video1" controls ></video>
<textarea></textarea>
<p onclick="finir()">Fini</p>

<script>

function finir() {
    navigator.getUserMedia({audio:true, video:true}, success, error);
}

function success(stream) {
    var champ = document.querySelector("textarea").value
    var texto = JSON.parse(champ)
    console.log(texto)
    var vid2 = document.querySelector("#video1");
    var pc2 = new RTCPeerConnection()
    pc2.setRemoteDescription(texto)
    pc2.createAnswer()
    pc2.onaddstream = function(e) {
        vid2.src = URL.createObjectURL(e.stream);
        vid2.play()
    }
}
function error(err) {
    console.log(err)
}



</script>

感谢您的帮助

Answer 1

哦，如果它会如此简单;）。

使用WebRTC，您还需要某种信令协议来交换各方之间的提供/回答。请查看许多WebRTC样本中的一个。

为什么我无法显示远程流？

1 个答案: