Chrome谷歌禁用网页音频解决办法

前言:做前端几年,代码的专业度远远不够,所以只能分享一些实用技巧,陆续会更新。没有高级的语言,只是把这些年踩的坑分享出来,希望给大家节省一些时间。
play() failed because the user didn't interact with the document first.
网页音频播放频繁的时候,各大浏览器都会禁用。之前我也在网上查了很多方法,有复杂的,有简单的,因为我们的客户体量大,电脑配置低各种问题,后来用了2个算是比较安全的方法

方法一:
--args --autoplay-policy=no-user-gesture-required
注意最后要有空格


image.png

image.png

然后打开谷歌,新建测试页
let n = new Audio();
let url = "http://tts.baidu.com/text2audio?cuid=baike&lan=ZH&spd=4&ctp=1&pdt=301&vol=9&rate=32&per=0&tex=" + encodeURI('测试');
n.src = url;
n.play();

方法二:iframe嵌入


image.png

image.png

<iframe
ref="iframe"
src={this.state.url}
width="100%"
height={0}
allow="autoplay 'src'"
frameBorder="0"
/>

PC这两种方法都适用,但是移动端有些兼容
安卓网页打开可以用第二种方法,iframe,
IOS网页打开暂时还没找到解决办法,如果大家有好的方法,可以留言

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容