If you have used Javascript to play an html5 video, you may encounter some errors, including this error:
or permission errors.
The reason is that browsers in recent years changed their policies to prevent autoplay video because they think users don't want it (that's correct in most cases).
What we can do to solve this issue?
- Add
autoplay
,muted
andplaysinline
attributes to your<video>
element. - If you need sound, you should put an unmute button beside the video, then in onClick callback, get video element and set
muted = false
by Javascript.
Pro Tip! If you have multiple videos on your page and only a single unmute button, then make sure to unmute all videos in the click callback of that button, otherwise, iOS won't let you unmute video before playing it on demand.
That's it, happy autoplaying!
Top comments (2)
What if I don't want the video to autoplay?
In that case just don't add
autoplay
attribute to the video tag. Addingautoplay="false"
orautoplay="true"
are equal and will autoplay the video.