ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

Chrome 中的自动播放策略&如何设置自动播放

2021-09-09 18:00:52  阅读:1007  来源: 互联网

标签:浏览器 Chrome 用户 设置 自动播放 允许 播放


Chrome 中的自动播放策略

为了改善用户体验,谷歌浏览器限制了音视频的自动播放,最大限度地减少广告骚扰,并减少数据消耗

Chrome 66 开始限制了 video 和 audio 元素的自动播放,从 Chrome 71 开始限制了 Web Audio API 的自动播放,因此一些网页游戏和webrtc相关的音视频项目都会相应收到影响

autoplay

虽然限制了自动播放,但是还有一些情况下是允许自动播放的

  1. 静音状态下始终允许自动播放
  2. 有声音自动播放时:
    • 用户进行了页面点击等与界面发生交互行为后
    • 达到媒体参与指数, 也就是用户之前在本站播放过有声音的视频
    • 用户将页面添加到移动设备的主屏幕上或者在PC上安装了PWA
  3. 主站可以将自动播放权限委托给它们的 iframe,以允许自动播放声音。

媒体参与指数

媒体参与指数 (MEI) 衡量个人在网站上消费媒体的倾向。Chrome 的方法是访问每个来源的重要媒体播放事件的比率:

  • 音视频播放时间必须大于 7 秒。
  • 必须存在音频且未静音。
  • 必须处于正在播放视频的标签页
  • 视频的大小必须大于200x140像素

该指数仅在PC端浏览器有效, 当分数足够高时则允许自动播放

用户的 MEI 可在about://media-engagement内部页面获得

始终允许自动播放

有时我们想让浏览器一直可以自动播放则需要设置:

chrome.exe --autoplay-policy=no-user-gesture-required

始终禁止自动播放

有时我们想让浏览器一直不允许自动播放则需要设置:

chrome.exe --disable-features=PreloadMediaEngagementData, MediaEngagementBypassAutoplayPolicies

允许iframe自动播放

默认情况下同源iframe允许自动播放

不是同源的则需要设置:

<!-- 允许自动播放 -->
<iframe src="跨源地址" allow="autoplay">

<!-- 允许自动播放和设置全屏 -->
<iframe src="跨源地址" allow="autoplay; fullscreen">

检测浏览器是否支持自动播放

https://video-dev.github.io/can-autoplay/

任何时候都不要假设会自动播放

引导用户进行交互行为是最稳妥的方式

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

if (promise !== undefined) {
  promise.then(_ => {
    // 开始播放
  }).catch(error => {
    // 需要用户进行页面交互
  });
}

标签:浏览器,Chrome,用户,设置,自动播放,允许,播放
来源: https://blog.csdn.net/qq_35052138/article/details/120205490

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有