Chrome自动播放限制策略

原文链接:Chrome 自动播放限制策略

Web浏览器正在朝着更严格的自动播放策略发展,以便改善用户体验,最大限度地降低安装广告拦截器的积极性并减少昂贵和/或受限网络上的数据消耗。这些更改旨在为用户提供更大的播放控制权,并使开发商获得合法用例。

开发人员最佳实践 / 视频元素

  • 永远不要假设视频会播放,并且在视频不是真正播放时不要显示暂停按钮。

  • 关注播放函数返回的Promise

    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.
    });
    }

使用静音自动播放

复制代码
<video id="video" muted autoplay>
<button id="unmuteButton"></button>

<script>
  unmuteButton.addEventListener('click', function() {
    video.muted = false;
  });
</script>

图 / html5视频播放器调用效果(倍速切换)

图 / html5视频播放器调用效果(超清/高清/流畅画质切换)

MR虚拟直播

无延迟直播

视频加密与安全

在线导播台

相关推荐
Helix2504 小时前
Chrome 性能优化实战:内存节省、硬件加速与 Flags 设置,让浏览器更流畅
chrome·google·性能优化·内存占用·硬件加速·设置技巧·浏览器优化
Ikalus19887 小时前
我的浏览器自动化脚本连着骗了我七次,其中一次是我自己给它盖的「已验证」
chrome
Helix2508 小时前
Chrome 标签页管理术:分组、固定、搜索与恢复,告别标签页混乱
chrome·google·分组·标签页管理·固定标签·标签页恢复
谷哥的小弟8 小时前
基于PowerShell的Chrome无痕访问
chrome·powershell·网络环境·无痕访问
web打印社区8 小时前
Lodop 提示未安装或请升级:Chrome 里先分清该装哪套
开发语言·前端·javascript·chrome·websocket·http
Frag0ut9 小时前
新兴浏览器内核能和 Chrome 有一战之力吗?Servo、Ladybird、WebKit 与 Gecko 的技术格局分析
chrome·浏览器·webkit·blink·gecko·servo·ladybird
Frag0ut11 小时前
从技术角度看Chrome与Firefox:内核、性能、隐私与开发体验深度对比
chrome·firefox·开发工具·webkit·隐私保护·blink·gecko
小狼1545419 小时前
浏览器扩展脚本为什么有时候不生效:注入时机、iframe 和单页路由,多多开票助手
前端·chrome
Helix2501 天前
Chrome 快捷键效率提升:10 个常用快捷键,把浏览速度提升一个量级
chrome·google·浏览器·使用技巧·效率工具·快捷键·爆红教程
指针向南1 天前
Chrome读不了HEIC怎么办:原生解码和WASM两条路
前端·图像处理·人工智能·chrome·计算机视觉·wasm