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虚拟直播

无延迟直播

视频加密与安全

在线导播台

相关推荐
powerfulzyh1 天前
Docker中运行的Chrome崩溃问题解决
chrome·docker·容器
代码的乐趣2 天前
支持selenium的chrome driver更新到136.0.7103.92
chrome·python·selenium
努力学习的小廉2 天前
深入了解linux系统—— 自定义shell
linux·运维·chrome
fenglllle3 天前
macOS 15.4.1 Chrome不能访问本地网络
chrome·macos
yousuotu3 天前
python如何提取Chrome中的保存的网站登录用户名密码?
java·chrome·python
颜淡慕潇4 天前
【Python】超全常用 conda 命令整理
chrome·python·conda
eguid_14 天前
WebRTC流媒体传输协议RTP点到点传输协议介绍,WebRTC为什么使用RTP协议传输音视频流?
java·网络协议·音视频·webrtc·实时音视频
网硕互联的小客服4 天前
如何解决 Linux 系统文件描述符耗尽的问题
linux·运维·chrome
海尔辛4 天前
学习黑客正经版Bash 脚本入门教程
chrome·学习·bash
eguid_14 天前
WebRTC工作原理详细介绍、WebRTC信令交互过程和WebRTC流媒体传输协议介绍
java·音视频·webrtc·实时音视频