消失许久,Chrome内核引起博客音乐无法播放

发布于 / 代码·杂谈 / 3 条评论

前言:消失了七个月虽不是真正的博客养草,也差不多,一直loc在摸鱼,小动作经常有但懒到不想记录,就在前几天我市爆发疫情,封城后无所事事,睡觉睡的昏昏沉沉/浑身疼,有句话怎么说:“吃饱不想动,饿了光腰疼,不饱不饿发迷瞪”。

本想打CSGO,突然想起早晨睡觉时来邮件博客被爆破,发现无大碍处理了几条垃圾评论,作为自带背景音乐的帅比肯定要走曲,发现无法播放 控制台显示Uncaught(in promise) DOMException

最新版的Chrome浏览器(Chromium内核的浏览器)/最新版的火狐也是如此,已不再允许自动播放音频和视频!就算你为videoaudio标签设置了autoplay属性也一样不能自动播放。

搜了搜相关的问题整理了一下,也方便看到此文章遇到此问题的朋友!

常规解决方法一

比较常规的做法是,为video标签设置muted属性,使它静音,这样视频就能自动播放了,但是没有声音。然后待用户在网页上有了任意触发后,再将muted去掉。或者让用户手动去打开音频(腾讯视频就是这样做的)。

<video autoplay muted></video>
document.body.addEventListener('mousedown', function(){
vdo.muted = false;
}, false);

hack方法二

Chrome浏览器虽然对video标签和audio标签做了非常严格的限制,但它对另一个同样能播放音频和视频的标签iframe的限制却没那么严格。那么我们可使用iframe来触发权限!

<iframe style="display:none" src="<?php echo TEMPLATE_URL; ?>audio/null.mp3">
</iframe>

至此页面加入代码后测试可正常播放,真好又水了一篇!

 

参考此篇文章:http://www.nooong.com/docs/chrome_video_autoplay.htm

转载原创文章请注明,转载自: 白纸博客 » 消失许久,Chrome内核引起博客音乐无法播放
  1. 原来如此

    1. @pirssr 我也没想到会突然失效!
  2. 之前貌似也有这种情况。。