Vimeo video autoplay not working in Safari 11: Not

问题:

Since the last Safari update to version 11, some videos stopped working. The worst is that sometimes, like once in five attempts, it works. I thought that the reason is my JS script that integrates Vimeo Player API but it ends up that even Vimeo's embed link doesn't work at all.

So, when you open embed video in Safari 11 it won't start and it blocks completely. You can see it by opening i.e. https://player.vimeo.com/video/XXXXXXXX?autoplay=1

In console log you can get something like:

Unhandled Promise Rejection: NotAllowedError (DOM Exception 35): The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.

回答1:

You can add background URL param to iframe src:

<iframe src="https://player.vimeo.com/video/XXXXXXXX?autoplay=1&background=1>

If your video has a sound you can also export your video again with no sound track at all. Than you probably don't need the background param at all.

The catch is that Safari 11 is blocking all videos autoplay if they have sound in it.

Even when video, like in my case, doesn't have sound level but it is exported with sound with no volume. You can see the sovolume icon in address bar:

回答2:

Because safari does not allow auto play of all video. you can add mousemove event listener. When the mouse moves, video starts playing. Then you must remove this event.

回答3:

iOS Support: Automatic playing of videos is supported as of iOS 10+, but requires the playsinline attribute on the tag.