webRTC ReferenceError: webkitRTCPeerConnection is not defined

webRTC ReferenceError: webkitRTCPeerConnection is not defined

我正在学习关于学习 WebRTC 的书并创建一个演示 4 章。我在控制台中遇到错误:

ReferenceError: webkitRTCPeerConnection is not defined

并且不明白我可以向 "iceServers":

这是我的 javascript 代码

function hasUserMedia(){
    navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
    return !!navigator.getUserMedia; 
}

function hasRTCPeerConnection() {
    window.RTCPeerConnection = window.RTCPeerConnection || window.webkitRTCPeerConnection || window.mozRTCPeerConnection;
    return !!window.RTCPeerConnection;
}


//This function will create our RTCPeerConnection objects, set up the SDP offer and response, and find the ICE candidates for both peers. page 48

function startPeerConnection(stream) {
    var configuration = {
        // Uncomment this code to add custom iceServers
        "iceServers": [{ "url": "stun:stun.1.google.com:19302" }]
    };
    yourConnection = new webkitRTCPeerConnection(configuration);
    theirConnection = new webkitRTCPeerConnection(configuration);

    // Setup stream listening
    yourConnection.addStream(stream);
    theirConnection.onaddstream = function (e) {
        theirVideo.src = window.URL.createObjectURL(e.stream);
    };

    // Setup ice handling
    yourConnection.onicecandidate = function (event) {
        if (event.candidate){
            theirConnection.addIceCandidate(new RTCIceCandidate(event.candidate));
        }
    };

    theirConnection.onicecandidate = function (event) {
        if (event.candidate) {
            yourConnection.addIceCandidate(new RTCIceCandidate(event.candidate));
        }
    };

    // Begin the offer
    yourConnection.createOffer(function (offer) {
        yourConnection.setLocalDescription(offer);
        theirConnection.setRemoteDescription(offer);

        theirConnection.createAnswer(function (offer) {
            theirConnection.setLocalDescription(offer);
            yourConnection.setRemoteDescription(offer);
        });
    });
}


var yourVideo = document.querySelector("#yours"),
    theirVideo = document.querySelector("#theirs"),
    yourConnection, theirConnection;

if (hasUserMedia()) {
    navigator.getUserMedia({ video: true, audio: false }, function (stream) {
            yourVideo.src = window.URL.createObjectURL(stream);
            if (hasRTCPeerConnection()) {
                startPeerConnection(stream);
            } else {
                alert("Sorry, your browser does not support WebRTC.");
            }
        }, function (error) {
            console.log(error);
        }
    );
} else {
    alert("Sorry, your browser does not support WebRTC.");
}

它的输出是这样的..

请告诉我为什么我的视频无法正常播放?请帮我做这个

learning WebRTC

变化:

yourConnection = new webkitRTCPeerConnection(configuration);

进入:

yourConnection = new RTCPeerConnection(configuration);

因为 webkitRTCPeerConnection 适用于 Chrome 浏览器,并且代码已经在 hasRTCPeerConnection 中定义了 window.RTCPeerConnection 因此它适用于大多数浏览器(包括您正在使用的 Firefox ).

[编辑]

你的逻辑在这个程序中不正确。您正在这样创建两个连接:

yourConnection = new webkitRTCPeerConnection(configuration);
theirConnection = new webkitRTCPeerConnection(configuration);

这不合逻辑。您的程序是 2 点连接的一个点。您只需要设置连接。此外,您需要某种消息传递服务器来在两个对等点之间传输 SDP 消息。这不是ICE服务器的作用。

您的 ICE 配置没有问题。您正在使用 public Google STUN 服务器来处理建立 WebRTC 连接所需的流媒体和 public IP 发现。