macOS 上的自动播放策略变更

作为去年 Safari 针对 iOS 更新的视频策略的后续，本周我们宣布将对 Mac 上的自动播放策略进行重要变更。这些变更使用户能够以更少的干扰浏览网页，特别是缓解了自动播放声音的网站带来的困扰。

新行为

WebKit 引擎为用户代理配置和管理媒体自动播放策略提供了极大的灵活性。macOS High Sierra 中的 Safari 默认使用自动推理引擎来阻止大多数网站上带有声音的媒体元素自动播放。Safari 11 还通过打开 Safari 新的“网站”偏好设置窗格，或通过 Safari 菜单中的“此网站设置…”选项，让用户控制哪些网站被允许自动播放视频和音频。此外，一项新的省电功能可防止无声视频在后台标签页中隐藏或在屏幕外时自动播放。

Web 开发者的最佳实践

网站应假定任何 <video> 或 <audio> 的使用都需要用户手势点击才能播放。检测自动播放是否被拒绝非常重要，因为用户现在可以关闭所有形式的自动播放，包括无声视频。以下代码片段展示了检查此项操作的简便性。值得指出的是，新的自动播放策略既适用于作为视觉效果工具（如背景视频或动画 GIF 视频）的视频，也适用于作为可消费内容的视频。我们建议网站开发者使用这些新行为测试其网站，确保在自动播放被 Safari 自动禁用或被用户禁用时，任何自定义媒体控件都能正常运行。

• 使用 WebKit 内置媒体控件的网站可自动与新策略完美兼容。
• 不要假定媒体元素会播放，也不要从一开始就显示暂停按钮。查看 HTMLMediaElement 上 play 函数返回的 Promise 以判断其是否被拒绝。

var promise = document.querySelector('video').play();

if (promise !== undefined) {
    promise.catch(error => {
        // Auto-play was prevented
        // Show a UI element to let the user manually start playback
    }).then(() => {
        // Auto-play started
    });
}

• 自动播放限制是基于每个元素授予的。如果您想连续播放多个视频（或播放带声音的片头广告，然后是主视频），请更改媒体元素的源而不是创建多个媒体元素。
• 不要在不显示媒体控件的情况下播放广告，因为它们可能不会自动播放，用户也将无法开始播放。
• 请记住，渲染静音的音轨仍然是音轨，它们的存在会影响视频是否能自动播放。在这些情况下，带有静音音轨的视频将无法播放。应移除该音轨，或者，可以在媒体元素上设置 muted 属性。

反馈

我们非常乐意听取开发者对这些新自动播放策略的意见。请通过 Twitter 联系我们的 Web 技术推广大使 Jon Davis，与我们的团队分享您的想法。