如何在页面加载时播放实时视频?



我有一个javascript代码,检查是否有一些人连接到Twilio可编程视频的房间。如果有任何参与者,javascript将他们的远程视频添加到网页中。

// A function that adds a remote participant audio & video to the current web page.
function AddParticipantAudioAndVideo(participant) {     
participant.tracks.forEach(publication => {
if (publication.track) {
document.getElementById("some html item").appendChild(track.attach());
console.log("track subscribed");                    
}
});

participant.on('trackSubscribed', track => {
document.getElementById("some html item").appendChild(track.attach());
console.log('track subscribed');        
});     
}

function InitializeRoom() {
// room is defined somewhere else           
room.on('participantConnected', participant => {            
console.log('A remote Participant connected : ' + participant.identity);       
AddParticipantAudioAndVideo(participant);       
});

// Loop over all the participants already connected to the room
room.participants.forEach(participant => {AddParticipantAudioAndVideo(participant)});
} 

如果我调用这个代码从一个按钮点击,例如,它的工作和直播视频播放正常:

<div onclick="InitializeRoom()">My Button</div>

但是,如果我从页面加载事件处理程序调用完全相同的代码(在与页面进行任何手动交互之前),它不起作用,并且视频标记不会添加到html文档中。

window.addEventListener("load",function(event){ 
InitializeRoom();
});

我知道Chrome不喜欢带有音频和自动播放= true的视频。所以我想知道这个问题是否是由于同样的原因,如果有什么解决办法。

谢谢干杯,

我知道Chrome不喜欢带有音频和自动播放= true的视频。所以我想知道这个问题是否是由于同样的原因,如果有什么解决办法。

是的,没错。

根据你的其他问题,我假设你想在一些自动的上下文中这样做,你可以控制浏览器。如果是这样,你可以在Chrome/Chromium命令行中添加一个标志:

chrome.exe --autoplay-policy=no-user-gesture-required

参见:https://developer.chrome.com/blog/autoplay/#developer-switches

相关内容

  • 没有找到相关文章

最新更新