如何确定用户是否与文档交互以启动视频

Question

我在Chrome中尝试自动播放视频时遇到一个错误，上面写着：DOMException: play() failed because the user didn't interact with the document first.

对于"正常"页面，有一个解决方案：

var promise = document.querySelector('video').play();
if (promise !== undefined) {
promise.then(_ => {
// Autoplay started!
}).catch(error => {
// Autoplay was prevented.
// Show a "Play" button so that user can start playback.
});
}

但我使用Phaser框架Video对象播放视频，该对象不返回promise，所以我需要确定用户是否与尝试播放视频的页面before进行了交互。有什么解决办法吗？

Answer 1

查找与窗口的用户交互

var interacted = false;
function fun(){
interacted = true;
$(window).unbind("scroll");
$(window).unbind("click");
play();
}
$(window).bind("scroll click", fun);
function play(){
if(interacted){
//play audio or video
}
}