audio 自动播放被禁止的处理措施

11次阅读

共计 812 个字符,预计需要花费 3 分钟才能阅读完成。

If you have used audio or video, I guess you probably know autoplay attribute. Sometimes, PM wants to use that. However, the browsers doesn’t want that.
When I was using autoplay on 2018.10, I find that safari and chrome disabled autoplay when user haven’t interacted with the page, especially on safari mobile. It’s annoying.
So, if you want to use autoplay it may fail. So, some guys choose to play the audio when user click or touch the page. But I think the better way is to detect whether the user’s browser support autoplay. And the way is:
audioEl
.play()
.then(res => {
//not disabled
})
.catch(er => {
//disabled
})
However, ie11 and edge before 2018.1 returns undefined when audio.play(). So, if you care about that, you may try:
let audioState = audioEl.play()
if (audioState !== undefined) {
audioState
.then(res => {
//not disabled
})
.catch(er => {
//disabled
})
}
//other logic? what are you gonna do?
Original Post
Reference
Autoplay Best Practices with Video.js

正文完
 0