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 ブラウザーの場合と同様に、ほとんどのブラウザー (使用している Firefox を含む) で機能するように、コードは既に定義されていますwindow.RTCPeerConnection。hasRTCPeerConnection

[編集]

このプログラムのロジックは正しくありません。次のように両方の接続を作成しています。

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

これは論理的ではありません。あなたのプログラムは、2 ピア接続の 1 つのピアです。接続をセットアップするだけです。また、2 つのピア間で SDP メッセージを送信するには、ある種のメッセージング サーバーが必要です。これは ICE サーバーの役割ではありません。

ICE の構成は問題ありません。パブリック Google STUN サーバーを使用して、WebRTC 接続の確立に必要なストリーミングとパブリック IP 検出を処理しています。

于 2016-09-07T07:33:42.537 に答える