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

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
     }
}