Chrome Vimeo Iframe autoplay not working anymore

Question

since some days my vimeo iframe will not autoplay anymore. I know the chrome update, which will block autoplay videos with sound. Is the block already active?

The Vimeo Example code doesn't work:

<iframe src="https://player.vimeo.com/video/12345?autoplay=1&loop=1&autopause=0" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

But netflix.com and vimeo itself has an autoplay video on the homepage, which works.

EDIT: Chrome version 66.0.3359.139 macOS High Sierra 10.13.4

Does anyone have an idea or answer?

Thanks!

Do you have a link to a specific video and/or a page where the video is embedded and not autoplaying? I did a quick check on the Vimeo Embed Playground and autoplay works as expected with Chrome 66 on Windows 10: https://player.vimeo.com/embed?videos=76979871|w:640|h:360|a:1|m:0 — Tommy Penner, May 08 '18 at 15:22
i'm sorry it's local project, but you are the right, the playground works. I think it work, because you have an user interaction with the click. If i copy the embed code into a local html file it will not autoplay — GoE, May 08 '18 at 15:33

score 65 · Answer 1 · answered May 18 '18 at 11:39

65

Annotating the <iframe> with an allow attribute worked for me:

<iframe ... allow="autoplay; fullscreen"></iframe>

It's called "Iframe delegation" and is described here: https://developers.google.com/web/updates/2017/09/autoplay-policy-changes.

answered May 18 '18 at 11:39

whatwhywhenandwho

802
1
6
11

3

why is this at the bottom of the page? almost missed it. – swisswiss Nov 21 '18 at 22:41
3

This worked for me - Dec 2018 - to get around the autoplay issue in Chrome. It played with sounds when I added allow="autoplay; fullscreen" to the iframe tag. – davidbehan Dec 17 '18 at 19:07
1

Feb '20, worked for me. Make sure you keep your `?autoplay=1` parameter in after the URL. For example I have `` https://vimeo.zendesk.com/hc/en-us/articles/115004485728-Autoplaying-and-looping-embedded-videos Though `autopause=0` does not seem to work: the video still pauses when I click out of the tab – velkoon Feb 29 '20 at 23:35
`autopause=0` actually seems to disable pausing if you start playing a 2nd video on the same page (as it says in the URL I previously provided: https://vimeo.zendesk.com/hc/en-us/articles/115004485728-Autoplaying-and-looping-embedded-videos ), which I also want – velkoon Feb 29 '20 at 23:52
June 2020, worked for me. I was dynamically generating the iframe in an overlay when the user clicked a "view our video" button (i.e. the user has engaged and wants to view) – Jarrod McGuire Jun 23 '20 at 11:32

score 35 · Answer 2 · answered May 24 '18 at 13:34

35

You need to add &muted=1 to the iFrame src path and you need to add the attribute allow="autoplay" to the iFrame. Now the Vimeo video starts automatically again in Chrome.

answered May 24 '18 at 13:34

Floris

2,727
2
27
47

1

thanks bro, this soluition is the beter! – Juan Diego Ramirez Aug 23 '21 at 18:22

Manshoor Ahmad · Accepted Answer · 2018-11-06T01:36:59.613

yes, according to their documentation it is.

https://help.vimeo.com/hc/en-us/articles/115004485728-Autoplaying-and-looping-embedded-videos

EDIT:

Advance browsers like FireFox, Chrome and Safari are now blocking video autoplay by default.

CHROME Auto-Play Policy:

https://developers.google.com/web/updates/2017/09/autoplay-policy-changes

The Media Engagement Index, or MEI for short, a way of Chrome is to allow AutoPlay audio on your page to be based on your previous interactions with this webpage as a user. You can see what this looks like by going to

chrome://media-engagement/

MEI is calculated per user profile, and is persisted to incognito mode.

WEBKIT/SAFARI Auto-Play Policy:

https://webkit.org/blog/7734/auto-play-policy-changes-for-macos/

FIREFOX Auto-Play Improvements:

https://www.ghacks.net/2018/09/21/firefox-improved-autoplay-blocking/

NOTE: Don’t assume a media element will play, and don’t show the pause button from the start. Look at the Promise returned by the play function on HTMLMediaElement to see if it was rejected:

var promise = document.querySelector('video').play();

if (promise !== undefined) {
    promise.catch(error => {
        // Auto-play was prevented
        // Show a UI element to let the user manually start playback
    }).then(() => {
        // Auto-play started
    });
}

@ManshoorAhmad, Thanks I am seeing the link work now as well. It must have just been a glitch on Vimeo's side for a short period of time. That is a good example though of why it is important to include details in the answer and not just a link. — Jedediah Smith, Nov 06 '18 at 15:51
Executing `document.querySelector('video').play()` seems more like programmatic play than autoplay. How would one handle the promise without a `play()` command? — showdev, Apr 27 '21 at 02:19

score 5 · Answer 4 · edited Jul 03 '19 at 18:20

5

Autoplay + Mute + Start at time x sec =

<div>
    <iframe src="https://player.vimeo.com/video/342787403?&autoplay=1&loop=1&title=0&byline=0&portrait=0&muted=1&#t=235s" style="position:absolute;top:0;left:0;width:100%;height:100%;" width="1400" height="900" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen>
    </iframe>
</div>

#t parameter must be the last one.

edited Jul 03 '19 at 18:20

HK boy

1,398
11
17
25

answered Jul 03 '19 at 15:44

bcartign

59
1
2

I tried your code but it doesn't work. I am using Youtube video links. – Jeanne vie Feb 28 '20 at 10:55
that's because the iframe is missing the allow="autoplay" attribute – brett Dec 14 '20 at 10:08

score 4 · Answer 5 · answered May 24 '18 at 20:33

Now the autoplay video just works if the audio is muted, you need to add the muted parameter into your api or iframe code &muted=1, you can change your browser preferences to allow autoplay unmuted videos: chrome://flags/#autoplay-policy Change the default option to "No user gesture is required"

If the user clicks the video you can unmuted it!!

Atiqullah Ahmadzai · Answer 6 · 2023-04-15T16:10:50.057

4

muted parameter fixed my issue:

<iframe src="https://player.vimeo.com/video/x?background=1&autoplay=1&loop=1&byline=0&title=0&muted=1" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="autoplay; fullscreen"></iframe>

edited Apr 15 '23 at 16:10

answered Jan 20 '21 at 10:55

Atiqullah Ahmadzai

91
6

2

Shouldn't the [query string](https://en.wikipedia.org/wiki/Query_string) start with a question mark? – showdev Apr 26 '21 at 20:53
muted parameters also worked for me – Hardik Makwana Mar 17 '23 at 04:54

Mladen Janjetovic · Answer 7 · 2018-07-02T08:42:56.903

If you are paid member and want to use video as a background, this is probably what you need:

?background=1: This parameter automatically disables all elements in the player (play bar, buttons, etc), autoplays, loops, and mutes your video on load. Please note: the background parameter is only supported for videos hosted by paid members. Learn more here.

Or, if you are not:

?muted=1 This parameter will automatically mute your video on load. Once your video plays, viewers can manually un-mute by clicking on the volume bar within the player.

BUT, I still can't make it work on the phone.

Chrome Vimeo Iframe autoplay not working anymore

7 Answers7

Linked