使用適配器庫的WebRTC中的遠程視頻空白

我是WebRTC的新手，目前正試圖在我的Angular2項目中實現對等視頻聊天。我正在使用webrtc-adapter.js npm來設置連接。遠程視頻保持空白，只有本地攝像頭視頻正在工作。使用適配器庫的WebRTC中的遠程視頻空白

我剛纔提到的鏈接「：

Remote VideoStream not working with WebRTC

而且我已經在Chrome中檢查：//的WebRTC，內部/跟蹤的連接，但未能找到確切病因

下面是我的代碼：

setupRTC() { 
    var log = msg => "<p>" + msg + "</p>"; 
    var failed = e => log(e + ", line " + e.lineNumber); 
    this.pc = new RTCPeerConnection(SERVERS, DEFAULT_CONSTRAINTS); 
    this.remotepc = new RTCPeerConnection(SERVERS, DEFAULT_CONSTRAINTS); 
    var add = (pc, ca) => ca && pc.addIceCandidate(ca).catch(failed); 

    this.pc.onicecandidate = e => add(this.remotepc, e.candidate); 
    this.remotepc.onicecandidate = e => add(this.pc, e.candidate); 
    this.pc.ontrack = e => (this.remoteVideo.nativeElement.srcObject = e.streams[0]); 
    this.pc.oniceconnectionstatechange = e => log(this.pc.iceConnectionState); 
}

視頻聊天是在下面的按鈕事件的點擊啓動：

startVideo() { 
    debugger; 
    let nav = <any>navigator; 
    var log = msg => "<p>" + msg + "</p>"; 
    var failed = e => log(e + ", line " + e.lineNumber); 
    nav.mediaDevices.getUserMedia({ video: true, audio: true }) 
     .then(stream => this.pc.addStream(this.localVideo.nativeElement.srcObject = stream)) 
     .then(() => this.pc.createOffer()) 
     .then(offer => this.pc.setLocalDescription(offer)) 
     .then(() => this.remotepc.setRemoteDescription(this.pc.localDescription)) 
     .then(() => this.remotepc.createAnswer()) 
     .then(answer => this.remotepc.setLocalDescription(answer)) 
     .then(() => this.pc.setRemoteDescription(this.remotepc.localDescription)) 
     .catch(failed); 

}

在HTML，我有一個彈出：

     <modal #myModal3 cancelButtonLabel="Close" (onClose)="showCam()"> 
          <modal-header> 
           <h4>Video Chat</h4> 
          </modal-header> 

          <modal-content> 
           <div id="callPage" class="call-page"> 
            <video id = "localVideo" [src]="localVideo" autoplay></video> 
            <video id = "remoteVideo" [src]="remoteVideo" autoplay></video> 

            <div class="row text-center"> 
             <div class="col-md-12"> 
              <button id="callBtn" (click)="startVideo()">Call</button> 
              <button id="hangUpBtn">Hang Up</button><div id="div"></div> 
             </div> 
            </div> 

           </div> 
          </modal-content> 
         </modal>

有什麼建議？

來源

2017-08-26 user3573851

1）使用調試器2）你選擇了正確的相機源 - 有時你需要檢查其他解決方案。在大多數情況下，請選擇帶有「usb」前綴或後綴（設備名稱）的設備。任何消息日誌？ –

在調試器中，遠程的src顯示爲空。我錯過了什麼？你是否應該正確設置本地相機源？這裏推薦的設置是什麼？ – user3573851

是的，嘗試其他設備。如果您有帶麥克風和麥克風的網絡攝像頭，則可能只有（例如）帶有黑色屏幕的音頻... –

你只是發送一種方式，並聽錯了結尾。變化：

this.pc.ontrack = e => this.remoteVideo.srcObject = e.streams[0];

到

this.remotepc.ontrack = e => this.remoteVideo.srcObject = e.streams[0];

然後它爲我工作。

來源

2017-08-27 00:05:53 jib

Jib，你是否在你的最後得到這個工作？這是在兩個獨立系統上運行的兩個會話之間接收遠程視頻的唯一更改嗎？ – user3573851

[是]（https://jsfiddle.net/jib1/hf1s577e/）。 – jib

使用適配器庫的WebRTC中的遠程視頻空白

回答

相關問題