浏览器自动播放策略

谷歌浏览器的自动播放政策主要是为了改善用户体验,限制视频和音频内容的自动播放。

  1. 静音自动播放:用户在访问网页时,如果视频或音频内容是静音的,可以自动播放。这意味着内容不会干扰用户的浏览体验。

  2. 用户交互触发:非静音的媒体通常需要用户与当前域进行交互直接交互才能播放,例如点击一个播放按钮。

  3. 用户设置:用户可以通过浏览器的设置来管理自动播放选项,包括允许或阻止特定网站的自动播放。

  4. 在桌面设备上,用户的媒体参与度阈值已经超过,意味着用户之前播放过有声视频(媒体参与度无法改变)

解决自动播放的方法:

1,判断能否自动播放(try-catch),不能的话就暂停视频(或者加个蒙层),让用户点击(抖音)

2,先设置视频为静音(可以自动播放了),然后创建一个音频上下文,判断能否自动播放,可以的话就让视频不要静音(b站的做法)

相关推荐
Data analyse4562 小时前
rnweb 回放数据量太大怎么办?分片存储与断点续传的实现思路
前端·网络·算法·数据分析
xiaogai_gai2 小时前
金蝶收料通知单查询策略实战教程:从源系统拉取到中间层落地的完整路径
java·前端·数据库
环境栈笔记3 小时前
指纹浏览器 WebRTC 怎么设置?从 ICE 候选、代理出口到功能验证
前端·人工智能·后端·自动化
赵大仁3 小时前
官网性能优化实战:LCP 3.2s → 2.1s、CLS 0.107 → 0,以及被我推翻的 6 个判断
前端·性能优化·cls·lcp·core web vitals
xiancai_xianyu3 小时前
Text2SQL落地生产库前,SQL要过哪三道闸
前端·数据库·sql·sql注入·text2sql·ai agent开发·企业级ai框架
小羊没烦恼!3 小时前
T-SQL查询进阶--理解SQL SERVER中的分区表
服务器·开发语言·前端·javascript·html
史瓦辛格4 小时前
给 DeepSeek Harness 写费用插件:把「这次会话花了多少钱」算准
前端·deepseek
星光不问赶路人4 小时前
Vue 3 + TypeScript 中 enum 的使用实践
前端·vue.js
鸥梨菌Honevid4 小时前
UVM 中 REQ 和 RSP 类型详解:从通信模型到 item_done 与 put_response
java·前端·servlet
IT_陈寒4 小时前
Python多进程共享变量这个坑,差点让我加班到凌晨
前端·人工智能·后端