Javascript Twilio视频参与者曲目未加载到dom
我遵循的是 基本上,我的本地视频工作正常,但当参与者加入房间时,我似乎无法将曲目添加到DOM元素中,因为对象的格式不同 第13行有:Javascript Twilio视频参与者曲目未加载到dom,javascript,dom,video,twilio,webrtc,Javascript,Dom,Video,Twilio,Webrtc,我遵循的是 基本上,我的本地视频工作正常,但当参与者加入房间时,我似乎无法将曲目添加到DOM元素中,因为对象的格式不同 第13行有: container.appendChild(track.attach()) 但我在参与者加入时遇到以下错误: 未捕获(承诺中)类型错误:track.attach不是一个函数 这是因为RemoteVideoTrackPublication对象(上面解析为track)的结构中包含对象“track”,因此它实际上应该是container.appendChild(trac
container.appendChild(track.attach())代码>
但我在参与者加入时遇到以下错误:
未捕获(承诺中)类型错误:track.attach不是一个函数
这是因为RemoteVideoTrackPublication
对象(上面解析为track
)的结构中包含对象“track”,因此它实际上应该是container.appendChild(track.track.attach())参与者对象的代码>。。然而
这只在JS控制台中起作用。在客户端JS控制台发生此错误后,我可以附加视频流-但无论我如何尝试,我似乎都无法正常添加曲目,因为attach。(
函数似乎不存在于track
对象上
这是一个简单的DOM或事件排序问题吗?我也有同样的问题,我在将twilio更新到版本2并在连接后更改代码时解决了这个问题
room.participants.forEach(function (participant) {
console.log('Remote Participant connected: ', participant);
participant.tracks.forEach(function (publication) {
if (publication.isSubscribed) {
const track = publication.track;
document.getElementById('co-browsing-remote-screen').appendChild(track.attach());
}
});
});
展示一点你的代码会很有帮助。在这里可以看到更多你正在使用的代码。另外,请注意,快速入门教程使用了Twilio视频的1.x版,我相信RemoteVideoTrackPublication
对象是2.x版的一部分。请不要只发布代码答案。对于未来的读者来说,更有趣的是看到解释了这一问题的原因。有解释的答案往往更容易被接受。
room.participants.forEach(function(participant) {
let previewContainer = document.getElementById('remoteTrack');
participant.on('trackSubscribed', track => {
previewContainer.appendChild(track.attach());
});
});