添加了网易云音乐的播放代码后,有时候不能自动播放,网易云音乐官方的引用代码如下:
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=190 height=86 src="//music.163.com/outchain/player?type=2&id=473115525&auto=1&height=66"></iframe>
不能自动播放时控制台会提示:
Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first. https://goo.gl/xX8pDD
看看 https://goo.gl/xX8pDD ,大概意思就是说为了避免网页音乐给用户带来困恼,Chrome从Version 66后增加了控制:
Chrome浏览器的自动播放政策将于2018年4月更改。
- 始终允许静音自动播放。
- 在以下情况下,允许自动播放声音:
- 顶部框架可以将自动播放权限委派给其iframe,以允许自动播放声音。
网易云音乐是用iframe来嵌入的,看看“顶部框架可以将自动播放权限委派给其iframe,以允许自动播放声音。”这个能否解决。
官方介绍了解决方法:
<!-- Autoplay is allowed. -->
<iframe src="https://cross-origin.com/myvideo.html" allow="autoplay">
<!-- Autoplay and Fullscreen are allowed. -->
<iframe src="https://cross-origin.com/myvideo.html" allow="autoplay; fullscreen">
改一下原来的网易云音乐引用代码:
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=190 height=86 src="//music.163.com/outchain/player?type=2&id=473115525&auto=1&height=66" allow="autoplay"></iframe>
再尝试刷新几次首页,发现可以自动播放了。(注:也并不是每次都可以,但是感觉概率比之前大了)