6

我正在研究学习 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.");
}

它像这样输出..在此处输入图像描述

请让我知道为什么我的视频无法正常播放？请帮我这样做

学习WebRTC

4

1 回答 1

6

改变：

yourConnection = new webkitRTCPeerConnection(configuration);

进入：

yourConnection = new RTCPeerConnection(configuration);

与webkitRTCPeerConnectionChrome 浏览器一样，并且代码已经定义window.RTCPeerConnection，hasRTCPeerConnection因此它适用于大多数浏览器（包括您正在使用的 Firefox）。

[编辑]

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

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

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

您的 ICE 配置很好。您正在使用公共 Google STUN 服务器来处理建立 WebRTC 连接所需的流式传输和公共 IP 发现。

于 2016-09-07T07:33:42.537 回答