webrtc和peerjs：如何播放流而不開始自己的流？

Question

我使用peerjs

媒體電話

var getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia; 
getUserMedia({video: true, audio: true}, function(stream) { 
    var call = peer.call('another-peers-id', stream); 
    call.on('stream', function(remoteStream) { 
    // Show stream in some video/canvas element. 
    }); 
}, function(err) { 
    console.log('Failed to get local stream' ,err); 
}); 

回答

var getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia; 
peer.on('call', function(call) { 
    getUserMedia({video: true, audio: true}, function(stream) { 
    call.answer(stream); // Answer the call with an A/V stream. 
    call.on('stream', function(remoteStream) { 
     // Show stream in some video/canvas element. 
    }); 
    }, function(err) { 
    console.log('Failed to get local stream' ,err); 
    }); 
}); 

問題是：拿到remoteStream，我需要證明我自己的流

var call = peer.call('another-peers-id', stream); 

如何播放其他流而無需顯示自己的流？

Answer 1

這不是一個錯誤，你只是困惑WebRTC API如何工作。我們首先創建一個名爲getUserMedia的函數變量，它將被映射到由瀏覽器提供的原生webrtc方法（例如，如果瀏覽器是Chrome，則方法navigator.getUserMedia將被分配給該變量，其餘的將爲空。方法navigator.mozGetUserMedia被分配給這個變量，其餘的將是空的，等等）。

將適當的本地方法分配給變量getUserMedia，然後我們用適當的參數調用此方法。這第一個參數是我們想要創建的呼叫的類型（即媒體約束），例如，僅音頻，音頻+視頻等。第二個參數是成功時的回調（即瀏覽器能夠成功訪問並連接到本地麥克風和/或相機等）。這個回調函數的一個例子是，

function(stream) { 
    var video = document.querySelector('video'); 
    video.srcObject = stream; 
    video.onloadedmetadata = function(e) { 
    // Do something with the video here. 
    }; 
} 

沒有爲getUserMedia方法，它是可選的，在您的示例代碼所缺少第三個參數，這個參數是一個回調，這將踢在情況getUserMedia另一種方法方法失敗。可能有許多失敗的原因，例如用戶不允許瀏覽器訪問本地麥克風或攝像頭等。使用此回撥方法，您可以通知用戶有關通話失敗問題。

下面是完整的示例代碼（參考https://developer.mozilla.org/en-US/docs/Web/API/Navigator/getUserMedia）

var getUserMedia = navigator.getUserMedia || 
        navigator.webkitGetUserMedia || 
        navigator.mozGetUserMedia; 

if (getUserMedia) { 
    getUserMedia({ audio: true, video: { width: 1280, height: 720 } }, 
    function(stream) { 
    var video = document.querySelector('video'); 
    video.srcObject = stream; 
    video.onloadedmetadata = function(e) { 
     video.play(); 
    }; 
    }, 
    function(err) { 
    console.log("The following error occurred: " + err.name); 
    } 
); 
} else { 
    console.log("getUserMedia not supported"); 
} 

如果你不想把你自己的音頻和/或視頻，然後只需將其設置爲false，在媒體的約束變量。

希望這會有所幫助。