随着 OSX High-Sierra* 的发布，Safari 的一项新功能是网站上的视频不再自动播放，脚本也无法启动，就像在 iOS 上一样。作为用户，我喜欢该功能，但作为开发人员，它给我带来了一个问题：我有一个包含视频的浏览器内 HTML5 游戏。除非用户更改设置，否则视频不会再自动播放。这会打乱游戏流程。
我的问题是，我能否以某种方式使用玩家与游戏的互动作为视频自动开始播放的触发器，即使所述活动没有直接链接到视频元素？
我不能使用 jQuery 或其他框架，因为我的雇主对我们的开发施加了限制。一个例外是 pixi.js，在所有其他动画中，我们还使用它在 pixi 容器中播放我们的视频。
*同样的限制也适用于移动 Chrome。
是的，您可以绑定不是直接在视频元素上触发的事件：
btn.onclick = e => vid.play();<button id="btn">play</button><br>
<video id="vid" src="https://dl.dropboxusercontent.com/s/bch2j17v6ny4ako/movie720p.mp4"></video>因此，您可以将此按钮替换为任何其他要求用户单击的启动画面，并且您将被授予播放视频的权限。
但是为了保持这种能力，您必须在事件处理程序本身内至少调用一次视频play方法。
btn.onclick = e => {
// won't work, we're not in the event handler anymore
setTimeout(()=> vid.play().catch(console.error), 5000);
}<button id="btn">play</button><br>
<video id="vid" src="https://dl.dropboxusercontent.com/s/bch2j17v6ny4ako/movie720p.mp4"></video>btn.onclick = e => {
vid.play().then(()=>vid.pause()); // grants full access to the video
setTimeout(()=> vid.play().catch(console.error), 5000);
}<button id="btn">play</button><br>
<video id="vid" src="https://dl.dropboxusercontent.com/s/bch2j17v6ny4ako/movie720p.mp4"></video>Ps：这是specs 定义的受信任事件列表，我不确定 Safari 是否仅限于这些，也不确定是否包含所有这些。
Chrome 有一个由每个主机的最大并发请求数引起的长期错误，这确实会影响页面中的 MediaElement 播放，将它们的数量限制为 6。
这意味着您不能使用上述方法在页面中准备超过 6 个不同的 MediaElement。
不过，至少存在两种解决方法：
decodeAudioData()方法，人们可以将所有音频资源加载为 AudioBuffers，甚至可以加载来自视频媒体的音频资源，这些图像流可以<video>与 AudioBuffer 并行显示在静音元素中。