I can't autoplay vimeo video (mobile)

Question

I'm trying to autoplay a video included in a iframe on mobile devices.

The app works well, but the user must click on the button inside the iFrame to play the video.

I already tried to use the "autoplay=1" parameter in the iframe but it didn't work on mobile (on desktop well).

Can you help me?

Answer 1

As @A.Wolff remarks, autoplay is disabled by design to preserve bandwidth.

It's, for instance, possible to "trick" iOS into thinking that the user clicked the play button (Google it, if you want to know how).

However, Vimeo would have to implement this since you won't be able to manipulate the contents of an iframe from an external source.

Conclusion: You can't autoplay an embeded Vimeo video on mobile devices.

(For the curious, I did some digging in the source of the embed player via remote debugging in Safari and wasn't able to find a way to get the video to play without tapping the play button)

Answer 2

I tried Vimeo iframe player with iOS 11 and autoplay parameter works well. Only problem is with playing video inline. It seems not possible (at least I couldn't do it).

I tried it also with android (SDK 19 - Android 4.4 and above). Autoplay param doesn't work here for me but I am able to autoplay videos with little workaround:

player.loadVideo(videoId).then(function(id)
{
    player.play()
    player.pause()
    setTimeout(function() { player.play() }, 750)
})

The player have to be initialized with random video, for example:

player = new Vimeo.Player('player', {
    id: 59777392,
    //autoplay: 1 // only for iOS, it is not necessary on Android
})

and after player.ready() method is fired you can call loadVideo(videoId) like I showed above.

Answer 3

https://vimeo.com/help/faq/mobile/mobile-videos#why-cant-i-loop-or-autoplay-my-videos-on-mobile-devices

The link above clearly states that Vimeo won't support mobile autoplay feature. Try using YouTube or BrightCove and I'm certain they do.

Answer 4

Here's my implementaion! I used a library called plyr from Plyr.io

HTML

<div class="plyr__video-embed" id="player">
  <iframe
    src="https://player.vimeo.com/video/videoID?loop=true&amp;autoplay=1&amp;byline=false&amp;portrait=false&amp;title=false&amp;speed=true&amp;transparent=0&amp;gesture=media"
    allowfullscreen
    allowtransparency
    allow="autoplay"
  ></iframe>
</div>

Javascript

document.addEventListener("DOMContentLoaded", function() {
  const player = new Plyr('#player', {
  autoplay: true,
  controls: false,
  loop: {active: true},
  clickToPlay: false,
    muted: true
});
  document.querySelector('[data-play]').addEventListener('click', () => {
        player.play();                                               
});

  setTimeout(() => {
             document.querySelector('[data-play]').click();
  console.log("play");
             }, 2000)
});

It allows playing Vimeo videos automatically on browsers. It works with youtube also Don't forget to include javascript and css file for plyr library.