如何确定用户是否与文档交互以开始视频？

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 对象播放视频，该对象不返回承诺，因此我需要确定用户是否与尝试播放视频的页面 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
     }
}