Youtube iframe src autoplay not working in chrome

Question

I have attached this iframe code to my plain html page. here i want to make an auto play when the page is loaded. i tried in firefox its working fine for me . when i load in chrome its not getting the autoplay.

my code is <iframe width="420" height="345" src="https://www.youtube.com/embed/qsP3Y4hHyeM?autoplay=1"> </iframe>

its working fine for firefox browser . but when am loading to the chrome browser its not working.

anybody could you please help me ?

any thing i have to make extra parameters?

Thankyou.

Answer 1

This is a feature introduced by the Chrome development team back in 2018: https://developers.google.com/web/updates/2017/09/autoplay-policy-changes

and a related requirement: https://developers.google.com/web/updates/2017/09/autoplay-policy-changes#iframe

The article explains what conditions, regarding the embedded audio/video content & regarding the user interaction, are being required in order to make Autoplay functioning:

• Muted autoplay is always allowed.

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

  <!-- Autoplay is allowed. -->
  <iframe src="https://cross-origin.com/myvideo.html" allow="autoplay">
  
  <!-- Autoplay and Fullscreen are allowed. -->
  <iframe src="https://cross-origin.com/myvideo.html" allow="autoplay; fullscreen">
  

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

Media Engagement Index (MEI)

The MEI measures an individual's propensity to consume media on a site. Chrome's current approach is a ratio of visits to significant media playback events per origin:

• Consumption of the media (audio/video) must be greater than 7 seconds.
• Audio must be present and unmuted.
• Tab with video is active.
• Size of the video (in px) must be greater than 200x140.

Answer 2

The chrome developer team disabled the autoplay feature to avoid irritation among users because of the automatic video play. You can enable it by the following steps:

1. Opening a Chrome browser and typing: chrome://flags/#autoplay-policy
2. Changing the "Autoplay policy" from "Default" to "No user gesture is required"
3. Pressing "relaunch"
4. Rebooting the device

From now on autoplay works again in webview components used in your app.