个人中心
文章发布
退出
作者热门文章
- iOS/Objective-C 元类和类别
- objective-c - -1001 错误，当 NSURLSession 通过 httpproxy 和/etc/hosts
- java - 使用网络类获取 url 地址
- ios - 推送通知中不播放声音
31
4
我接触 WebRTC 时遇到了一个问题，即 RTCPeerConnection.ontrack 事件不会在创建新的 MediaStreamTrack 对象时触发(通过 RTCPeerConnection.addTrack() 函数)。
使用教科书 WebRTC getUserMedia 示例，当单击开始按钮时，我从我的笔记本电脑的相机中获取了一个流，我将其设置为一个元素(本地)的 srcObject。单击“调用”按钮时，我对抓取的流使用 addTrack 方法，我将其保存在全局 localStream 变量中。此时全局定义的 ontrack 事件处理程序应该触发并给我第二个视频，对吗？不过，没有骰子。
我能够让它与 addStream 和 onaddstream 一起工作 - 但两者都已从最新的 WebRTC 规范中删除，并且不受最新版本的 Chrome 和 FireFox 的支持。
附上图片和脚本 - 任何指导将不胜感激!
'use strict';
var localStream;
var yourVideo = document.querySelector('#yours');
var theirVideo = document.querySelector('#theirs');
var callBtn = document.querySelector('#callBtn');
var startBtn = document.querySelector('#startBtn');
startBtn.onclick = hasUserMedia;
callBtn.onclick = call;
var cfg = null;
var pc1 = new RTCPeerConnection(cfg);
var pc2 = new RTCPeerConnection(cfg);
pc1.ontrack = function(e){
console.log("ontrack fired!");
theirVideo.srcObject = e.streams[0];
}
function hasUserMedia(){
console.log("entering hasUserMedia()...");
navigator.mediaDevices.getUserMedia({video: true, audio: false}).then(function(stream){
localStream = stream;
console.log("stream val: " + localStream);
yourVideo.srcObject = stream;
});
}
function call(){
console.log("stream val @ call(): " + localStream);
localStream.getTracks().forEach(track => pc1.addTrack(track, localStream));
}
index.html
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Learning WebRTC - Chapter 4: Creating a
RTCPeerConnection</title>
<style>
body {
background-color: #3D6DF2;
margin-top: 15px;
}
video {
background: black;
border: 1px solid gray;
}
#container {
position: relative;
display: block;
margin: 0 auto;
width: 500px;
height: 500px;
}
#yours {
width: 150px;
height: 150px;
position: absolute;
top: 15px;
right: 15px;
}
#theirs {
width: 500px;
height: 500px;
}
</style>
</head>
<body>
<div id="container">
<video id="yours" autoplay></video>
<video id="theirs" autoplay></video>
<button id="startBtn">Start</button>
<button id="callBtn">Call</button>
</div>
<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>
<script type="text/javascript" src="main.js"></script>
</body>
</html>
最佳答案
Firefox 和 Chrome 仍然支持 onaddstream。 Chrome 尚不支持 addTrack，您仍然可以使用 addStream(尽管 Firefox 提示)。
您的脚本也缺少 SDP 和 ICE 候选项的交换，以便开火。
检查 https://webrtc.github.io/samples/src/content/peerconnection/pc1/一个完整的工作示例。
关于javascript - RTCPeerConnection.ontrack 事件未触发，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41145823/
31
4
0
我最近一直在研究 webRTC，并且正在创建一个抽象层，以便通过网状网络架构轻松获得多个客户端通信。 我的问题是关于创建数据通道。目前我执行以下操作: var pc = new RTCPeerConn
我知道网络浏览器对同时 http 请求的数量等有限制。但是对于打开的 RTCPeerConnection 的网页可以拥有的数量也有限制吗？ 并且有些相关:RTCPeerConnection 允许通过
我正在尝试检测 RTCPeerConnection 的另一端何时断开连接。目前我正在对我的 RTCPeerConnection 对象执行以下操作: rtcPeerConnection.onicecon
有谁知道有什么好的RTCPeerConnection教程？ 我想在浏览器之间直播网络摄像头。我有 websocket从我的服务器到所有客户端的连接，所以它应该相当容易 - 但到目前为止我在该主题上发现
我正在尝试检测 RTCPeerConnection 的另一端何时断开连接。目前我正在对我的 RTCPeerConnection 对象执行以下操作: rtcPeerConnection.onicecon
我可以使用以下代码创建一个新的对等连接对象: var peer = new RTCPeerConnection(); 发生这种情况时，chrome 在 chrome://webrtc-internal
建立首次成功的 RTC 连接的最佳方法是什么？ 下面的代码有时有效，有时无效。我认为这是在 createAnswer 之前或之后调用 addIceCandidate 的问题，而且我不知道哪个更好，或者
我开始用 rtcPeerConnection 做一些测试，我是这个技术的初学者，我想知道它是否正常:在控制台中，当调用方法 onicecandidate 时，我打印了 ice candidate，但我
我正在我的 chrome 浏览器中运行 WebRTC 演示，我已经可以设置视频 session 了。但是，如果其中一个对等点断开连接(例如刷新浏览器)，我不知道如何在另一端检测到它(并且可能会警告“对
如何更改代码，使计算机1的代码连接到计算机2的代码(计算机1和计算机2不是同一台计算机，但在同一网络上)。 它在本地工作，但在两台不同的计算机上不工作 用于连接的计算机 1 和计算机 2 代码定义如下
这是著名的 Chromium bug:https://bugs.chromium.org/p/chromium/issues/detail?id=825576 错误是:无法构造“RTCPeerConn
我正在 Javascript 中运行一些 RTC(在 Chrome 上)，我希望能够看到所有打开的 RTCPeerCONnections(或任何处于任何事件状态的)。显然我可以将它们列为已创建的，但我
下面我摘录了this link关于 RTCPeerConnection.onicecandidate 并希望根据我的理解提出两个问题，如果我的概念正确与否，则需要帮助。对我来说有点复杂 The RTC
我正在创建一个应用程序，它将使用 WebRTC 将相机视频共享到多个对等连接。服务器只是为用户提供了一个房间，房间里的所有用户都会看到摄像头视频。唯一不起作用的是 onicecandidate 没有触
这个问题已经有答案了: RTCPeerConnection.createAnswer callback returns undefined object in mozilla for WebRTC c
我有一个非常简单的 RTCPeerConnection 应用在运行。使用 Firebase 发送信号。 RTCPeerConnections 建立，然后我获取流，并对其执行以下操作: let stre
有没有人看到过这个错误，字面意思是: “Uncaught DOMException: Failed to construct 'RTCPeerConnection': Cannot create so
我得到了一个RTCPeerConnection，建立连接后我想断开与网络服务器的连接。 如何检查已建立的连接？ readyState 始终是 undefined 并且 onopen 从未触发。 最佳答
我接触 WebRTC 时遇到了一个问题，即 RTCPeerConnection.ontrack 事件不会在创建新的 MediaStreamTrack 对象时触发(通过 RTCPeerConnectio
我的简单 WebRTC javascript 代码没有按预期工作。事实上，音频通话并没有建立(请注意，我对 WebRTC 了解最少，我是通过查看互联网上的示例创建的)。该页面应启动两个参与者之间的音频
我是一名优秀的程序员,十分优秀！