自动播放策略
按 MDN 的说法，video 的 autoplay 控制视频的自动播放。
<video src="/videos/awesomevid.mp4" autoplay>
但因为默认自动播放比较打扰用户，所以还需满足以下条件之一才能自动播放，以实现更好的用户体验。
视频静音（通过加上 muted 属性）或音量设置为 0
用户与网站进行了交互（通过点击、敲击、按键等）
站点已被列入浏览器白名单；
浏览器确定用户频繁使用媒体，自动加入白名单
或者通过首选项
或其他用户界面功能手动发生
自动播放功能策略授予了 <iframe> 及其文档自动播放支持。
另外，chromium 内核的浏览器满足以下条件，也可以自动播放。
用户已将该站点添加到其移动设备的主屏幕
或在桌面设备上安装了 PWA。
当前(2021-08)浏览器内核主要有 webkit (safari)、chromium(chrome、edge)，内核的自动播放策略决定了浏览器外在的视频自动播放表现。具体的更新策略可以参考以下的文档。(ps，主要是真的懒得一个个翻译了……）
chromium Autoplay policy in Chrome，2017-09-13 发布， 2021-05-25 更新
chromium www.chromium.org/audio-video… ， 2018-10-22 更新
webkit Auto-Play Policy Changes for macOS，2017-07-08 发布
webkit New video Policies for iOS，2016-07-25 发布
这些文章比较详细的介绍了自动播放策略的变更历史及相应的条件。
1、自动播放兜底
不要信任浏览器会自动播放，因为这玩意就是薛定谔的猫。所以我们最好加上一个 play 方法兜底，手动触发自动播放，并在失败的时候做些界面上的反馈。譬如出现重播或开启播放的按钮。
var promise = document.querySelector('video').play();
if (promise !== undefined) {
promise.catch(error => {
}).then(() => {
2、安卓微信内自动播放的兜底
截止当前（2021-08）安卓微信内自动播放现在是不被支持的，即便 video 静音了，也不行。为什么会出现这个特殊的情况，是因为安卓微信内核为 X5 内核，猜测是它的行为并没有同步最新的 chromium。
需要做一些兜底策略，可能如下：
如果是静音视频展示的场景，可以考虑针对安卓微信展示相同效果的 gif
非静音视频效果，默认展示明显的诱导开始播放的按钮
忽略不管，等待用户触发网页行为后，再手动开启 play 方法
3、全屏处理
某些移动端浏览器自动播放时，会开启全屏。如果是理想的产品视觉效果，当然无可厚非。但如果想要禁用播放全屏，需要考虑加上 playsinline 属性以做兼容。腾讯 x5 内核下，还需要开启同层渲染 x5-video-player-type='h5-page'，避免全屏。
<video
autoplay
src={videoUrl}
webkit-playsinline="true"
playsinline="true"
x5-video-player-type='h5-page'
iframe 内 video 自动播放
iframe 的情况自己没有上机研究过，具体可以参考 autoplay/#iframe-delegation
