WebRTC客户端无法在视频元素上显示远程流。

问题描述 投票:1回答:1

我试图测试一个WebRTC应用程序,用于视频通话,其信号服务器是用Spring Boot编写的。这是我正在运行的客户端代码。然而,在一个提议的情况下,远程窗口的本地流被打开,我可以看到本地视图视频元素的凸轮视图,但远程视图元素只是空白。我想我在代码中犯了一些明显的错误,请帮助我。请帮助我.客户端代码:

navigator.mediaDevices.getUserMedia(constraints).
  then(function(stream) { 
      pc.addStream(stream);
      var selfView = document.getElementById("selfView");
          selfView.srcObject = stream;
    }).catch(function(err) { console.log("Media not found", err) });

// once remote stream arrives, show it in the remote video element
pc.onaddStream = function (evt) {
    var remoteView = document.getElementById("remoteView");
    remoteView.srcObject = evt.stream;
};

}

这是我处理本地流和远程流的地方。

[如果你需要更多的信息,请评论代码部分以获取更多信息]

输出控制台。message {"type":"rtc","dest":"B","data":{"sdp":{"type":"answer","sdp":"v=0\r\no=- 2621698359003834693 2 IN IP4 127.0.0.1\r\ns=-\r\nt=0 0\r\na=group:BUNDLE 0 1\r\na=msid-semantic: WMS\r\nm=audio 9 UDP/TLS/RTP/SAVPF 111 103 104 9 0 8 106 105 13 110 112 113 126\r\nc=IN IP4 0.0.0.0\r\na=rtcp:9 IN IP4 0.0.0.0\r\na=ice-ufrag:BAgT\r\na=ice-pwd:OHwX08xs4J0OcKCd8z+ZbMXp\r\na=ice-options:trickle\r\na=fingerprint:sha-256 C6:31:0C:8E:B4:ED:88:36:A2:30:A7:84:63:CF:71:BA:36:AA:8B:AA:E1:32:A0:DB:B1:15:DE:04:BB:92:41:94\r\na=setup:active\r\na=mid:0\r\na=extmap:1 urn:ietf:params:rtp-hdrext:ssrc-audio-level\r\na=extmap:2 http://www.webrtc.org/experiments/rtp-hdrext/abs-send-time\r\na=extmap:3 http://www.ietf.org/id/draft-holmer-rmcat-transport-wide-cc-extensions-01\r\na=extmap:4 urn:ietf:params:rtp-hdrext:sdes:mid\r\na=extmap:5 urn:ietf:params:rtp-hdrext:sdes:rtp-stream-id\r\na=extmap:6 urn:ietf:params:rtp-hdrext:sdes:repaired-rtp-stream-id\r\na=recvonly\r\na=rtcp-mux\r\na=rtpmap:111 opus/48000/2\r\na=rtcp-fb:111 transport-cc\r\na=fmtp:111 minptime=10;useinbandfec=1\r\na=rtpmap:103 ISAC/16000\r\na=rtpmap:104 ISAC/32000\r\na=rtpmap:9 G722/8000\r\na=rtpmap:0 PCMU/8000\r\na=rtpmap:8 PCMA/8000\r\na=rtpmap:106 CN/32000\r\na=rtpmap:105 CN/16000\r\na=rtpmap:13 CN/8000\r\na=rtpmap:110 telephone-event/48000\r\na=rtpmap:112 telephone-event/32000\r\na=rtpmap:113 telephone-event/16000\r\na=rtpmap:126 telephone-event/8000\r\nm=video 9 UDP/TLS/RTP/SAVPF 96 97 98 99 100 101 102 122 127 121 125 107 108 109 124 120 123 119 114 115 116\r\nc=IN IP4 0.0.0.0\r\na=rtcp:9 IN IP4 0.0.0.0\r\na=ice-ufrag:BAgT\r\na=ice-pwd:OHwX08xs4J0OcKCd8z+ZbMXp\r\na=ice-options:trickle\r\na=fingerprint:sha-256 C6:31:0C:8E:B4:ED:88:36:A2:30:A7:84:63:CF:71:BA:36:AA:8B:AA:E1:32:A0:DB:B1:15:DE:04:BB:92:41:94\r\na=setup:active\r\na=mid:1\r\na=extmap:14 urn:ietf:params:rtp-hdrext:toffset\r\na=extmap:2 http://www.webrtc.org/experiments/rtp-hdrext/abs-send-time\r\na=extmap:13 urn:3gpp:video-orientation\r\na=extmap:3 http://www.ietf.org/id/draft-holmer-rmcat-transport-wide-cc-extensions-01\r\na=extmap:12 http://www.webrtc.org/experiments/rtp-hdrext/playout-delay\r\na=extmap:11 http://www.webrtc.org/experiments/rtp-hdrext/video-content-type\r\na=extmap:7 http://www.webrtc.org/experiments/rtp-hdrext/video-timing\r\na=extmap:8 http://tools.ietf.org/html/draft-ietf-avtext-framemarking-07\r\na=extmap:9 http://www.webrtc.org/experiments/rtp-hdrext/color-space\r\na=extmap:4 urn:ietf:params:rtp-hdrext:sdes:mid\r\na=extmap:5 urn:ietf:params:rtp-hdrext:sdes:rtp-stream-id\r\na=extmap:6 urn:ietf:params:rtp-hdrext:sdes:repaired-rtp-stream-id\r\na=recvonly\r\na=rtcp-mux\r\na=rtcp-rsize\r\na=rtpmap:96 VP8/90000\r\na=rtcp-fb:96 goog-remb\r\na=rtcp-fb:96 transport-cc\r\na=rtcp-fb:96 ccm fir\r\na=rtcp-fb:96 nack\r\na=rtcp-fb:96 nack pli\r\na=rtpmap:97 rtx/90000\r\na=fmtp:97 apt=96\r\na=rtpmap:98 VP9/90000\r\na=rtcp-fb:98 goog-remb\r\na=rtcp-fb:98 transport-cc\r\na=rtcp-fb:98 ccm fir\r\na=rtcp-fb:98 nack\r\na=rtcp-fb:98 nack pli\r\na=fmtp:98 profile-id=0\r\na=rtpmap:99 rtx/90000\r\na=fmtp:99 apt=98\r\na=rtpmap:100 VP9/90000\r\na=rtcp-fb:100 goog-remb\r\na=rtcp-fb:100 transport-cc\r\na=rtcp-fb:100 ccm fir\r\na=rtcp-fb:100 nack\r\na=rtcp-fb:100 nack pli\r\na=fmtp:100 profile-id=2\r\na=rtpmap:101 rtx/90000\r\na=fmtp:101 apt=100\r\na=rtpmap:102 H264/90000\r\na=rtcp-fb:102 goog-remb\r\na=rtcp-fb:102 transport-cc\r\na=rtcp-fb:102 ccm fir\r\na=rtcp-fb:102 nack\r\na=rtcp-fb:102 nack pli\r\na=fmtp:102 level-asymmetry-allowed=1;packetization-mode=1;profile-level-id=42001f\r\na=rtpmap:122 rtx/90000\r\na=fmtp:122 apt=102\r\na=rtpmap:127 H264/90000\r\na=rtcp-fb:127 goog-remb\r\na=rtcp-fb:127 transport-cc\r\na=rtcp-fb:127 ccm fir\r\na=rtcp-fb:127 nack\r\na=rtcp-fb:127 nack pli\r\na=fmtp:127 level-asymmetry-allowed=1;packetization-mode=0;profile-level-id=42001f\r\na=rtpmap:121 rtx/90000\r\na=fmtp:121 apt=127\r\na=rtpmap:125 H264/90000\r\na=rtcp-fb:125 goog-remb\r\na=rtcp-fb:125 transport-cc\r\na=rtcp-fb:125 ccm fir\r\na=rtcp-fb:125 nack\r\na=rtcp-fb:125 nack pli\r\na=fmtp:125 level-asymmetry-allowed=1;packetization-mode=1;profile-level-id=42e01f\r\na=rtpmap:107 rtx/90000\r\na=fmtp:107 apt=125\r\na=rtpmap:108 H264/90000\r\na=rtcp-fb:108 goog-remb\r\na=rtcp-fb:108 transport-cc\r\na=rtcp-fb:108 ccm fir\r\na=rtcp-fb:108 nack\r\na=rtcp-fb:108 nack pli\r\na=fmtp:108 level-asymmetry-allowed=1;packetization-mode=0;profile-level-id=42e01f\r\na=rtpmap:109 rtx/90000\r\na=fmtp:109 apt=108\r\na=rtpmap:124 H264/90000\r\na=rtcp-fb:124 goog-remb\r\na=rtcp-fb:124 transport-cc\r\na=rtcp-fb:124 ccm fir\r\na=rtcp-fb:124 nack\r\na=rtcp-fb:124 nack pli\r\na=fmtp:124 level-asymmetry-allowed=1;packetization-mode=1;profile-level-id=4d0015\r\na=rtpmap:120 rtx/90000\r\na=fmtp:120 apt=124\r\na=rtpmap:123 H264/90000\r\na=rtcp-fb:123 goog-remb\r\na=rtcp-fb:123 transport-cc\r\na=rtcp-fb:123 ccm fir\r\na=rtcp-fb:123 nack\r\na=rtcp-fb:123 nack pli\r\na=fmtp:123 level-asymmetry-allowed=1;packetization-mode=1;profile-level-id=640015\r\na=rtpmap:119 rtx/90000\r\na=fmtp:119 apt=123\r\na=rtpmap:114 red/90000\r\na=rtpmap:115 rtx/90000\r\na=fmtp:115 apt=114\r\na=rtpmap:116 ulpfec/90000\r\n"}}} main.js:53 message {"type":"rtc","dest":"B","data":{"candidate":{"candidate":"candidate:2761536593 1 udp 2122257663 2002:5045:45b:1000:4a5:1509:ac00:d8de 59352 typ host generation 0 ufrag BAgT network-id 1 network-cost 50","sdpMid":"0","sdpMLineIndex":0}}} main.js:53 message {"type":"rtc","dest":"B","data":{"candidate":{"candidate":"candidate:3431900620 1 udp 2122192127 2002:5045:45b:1000:14fc:574c:edfa:7c56 59353 typ host generation 0 ufrag BAgT network-id 2 network-cost 50","sdpMid":"0","sdpMLineIndex":0}}} main.js:53 message {"type":"rtc","dest":"B","data":{"candidate":{"candidate":"candidate:3598679702 1 udp 2122131711 2401:4900:2100:5485:448f:d349:55ce:db5f 59354 typ host generation 0 ufrag BAgT network-id 4 network-cost 10","sdpMid":"0","sdpMLineIndex":0}}} main.js:53 message {"type":"rtc","dest":"B","data":{"candidate":{"candidate":"candidate:578025069 1 udp 2122066175 2401:4900:2100:5485:30fb:9ce2:fef2:234c 59355 typ host generation 0 ufrag BAgT network-id 5 network-cost 10","sdpMid":"0","sdpMLineIndex":0}}} main.js:53 message {"type":"rtc","dest":"B","data":{"candidate":{"candidate":"candidate:1123076825 1 udp 2121998079 192.168.43.41 59356 typ host generation 0 ufrag BAgT network-id 3 network-cost 10","sdpMid":"0","sdpMLineIndex":0}}}

javascript video-streaming webrtc
1个回答
1
投票

其onaddstream,都是小写的。还要注意的是,onaddstream已经被弃用,取而代之的是ontrack。

© www.soinside.com 2019 - 2024. All rights reserved.