功能检测是否需要用户手势

Question

有没有办法检测是否允许在没有用户手势的情况下对视频元素调用 play()？ 在 Android Chrome 上会给出此警告：

Failed to execute 'play' on 'HTMLMediaElement': API can only be initiated by a user gesture.

因此，在 Chrome Android 上，需要用户手势才能开始播放视频，而桌面版 Chrome 则没有。 有没有办法检测我会得到哪种行为？

我希望我的应用程序的行为略有不同，具体取决于是否允许以编程方式调用 play。

我尝试使用Modernizr.videoautoplay，但它会检查元素上的autoplay 属性，这不是一回事。这会给 IE11 和 Edge 带来误报。

编辑：添加了an example。视频将在 Chrome 桌面和 Windows 8 或 10 上的 IE11 或 Edge（延迟 3 秒）中自动开始播放。对于 Chrome@Android，需要用户交互（单击按钮），并且可以在控制台中看到错误消息。

Answer 1

play 方法返回一个可以用来捕获错误的promise。

并非所有浏览器都遵循the specification，因此您必须先检查返回的内容是否是一个承诺。

var autoPlayAllowed = true;
var promise = document.createElement("video").play();
if(promise instanceof Promise) {
    promise.catch(function(error) {
        // Check if it is the right error
        if(error.name == "NotAllowedError") {
            autoPlayAllowed = false;
        } else {
            throw error;
        }
    }).then(function() {
        if(autoPlayAllowed) {
            // Allowed
        } else {
            // Not allowed
        }
    });
} else {
    // Unknown if allowed
}