Search code examples
google-chromeiframevimeoautoplay

Chrome Vimeo Iframe autoplay not working anymore

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!

Solution

  • 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.

    media engagement

    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
    });
}