Uncaught (in promise) DOMException: play() failed

广告：

Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first. https://goo.gl/xX8pDD

function playOrPaused() {

console.log(typeof audio);

console.log(typeof audio.paused);

if (audio.paused) {

audio.play(); //ERROR:Uncaught (in promise) DOMException: The element has no supported sources.

}

}

原来的插入audio的源码如下, 播放音频的时候在浏览器和调试器的debug环境会报如上错误，但是不影响iPhone等手机的使用

查阅相关资料发现audio可以支持两种方式设置src，如下：

1. Permitted content: If the element has a src attribute: zero or more <track> elements, followed by transparent content that contains no media elements — that is, no <audio> or <video> elements.

2. Else: zero or more <source> elements, followed by zero or more <track> elements, followed by transparent content that contains no media elements, that is no <audio> or <video> elements.

并且:src嵌入的音频的URL。 该URL应遵从 HTTP access controls. 这是一个可选属性；你可以在audio元素中使用 元素来替代该属性指定嵌入的音频。

于是改成第二种方案，解决问题，如下：

<audio id="audio">

<source src="http://ossweb-img.qq.com/images/lol/m/act/a20160315live/shake_sound_male.mp3" type="audio/mpeg">

Your browser does not support the audio tag.

</audio>

广告：