Google Chrome Does Not Autoplay Html5 Video on Mobile

Google Chrome does not autoplay HTML5 video on mobile

The problem is that Google want that users initiate by themselves any media, so If you debug your device chrome browser, you will get the warning "Failed to execute 'play' on 'HTMLMediaElement': API can only be initiated by a user gesture."
So that means you need to attach the video initialization, for example, with a click event

Video auto play is not working in Safari and Chrome desktop browser

The best fix I could get was adding this code just after the </video>

<script>
document.getElementById('vid').play();
</script>

...not pretty but somehow works.

UPDATE
Recently many browsers can only autoplay the videos with sound off, so you'll need to add muted attribute to the video tag too

<video autoplay muted>
...
</video>

HTML5 video autoplay not working in chrome

As per Google's latest policies, Muted videos can autoplay in Chrome. Autoplay with sound is allowed if:

  • User has interacted with the domain (click, tap, etc.).
  • On desktop, the user's Media Engagement Index threshold has been
    crossed, meaning the user has previously play video with sound.
  • On mobile, the user has [added the site to their home screen].

Top frames can delegate autoplay permission to their iframes to allow autoplay with sound.

Also, put the following tag after your <source> tag:-

<source src="assets/watertuin.ogg" type="video/ogg">

See, if it works now.

Check more about Google autoplay policy changes on:- https://developers.google.com/web/updates/2017/09/autoplay-policy-changes



Related Topics



Leave a reply



Submit