CODEWITHSUNDEEP
javascriptgoogle-chromeyoutubeembedyoutube-javascript-api
Pedro Barros
Pedro Barros

Reputation: 1336

Can't play YouTube video through iframe API when video is unmute

Since Chrome update to version 72, my custom player that runs over the YouTube Iframe API stopped working. It still works perfectly on Firefox or Chrome <= 71.

Using the code below, when function play() is triggered, the video starts buffering and then stops, without playing.

function onYouTubeIframeAPIReady() {
  ytIframe = $("#player")[0];
  ytPlayer = new YT.Player(ytIframe, {
    events: {
      'onReady': () => {},
      'onStateChange': () => {}
    }
  });
}

function play() {
  ytPlayer.playVideo();
}

The only way to make it work is to embed the video using the mute=1 url param on the iframe src. But even when I do this, if I try to unmute the player after the playVideo (using ytPlayer.unMute()), the video stops again.

Any ideas on what has changed with this Chrome 72 update? Is this a YouTube/Chrome bug or is it an expected behavior?

Thanks!

Upvotes: 6

Views: 4473

Answers (2)

user1729031
user1729031

Reputation: 122

"player.play()" doesn't work on latest version chrome, we can solve the issue by adding the allow="autoplay" attribute to your parent iframe

To know the root cause, you can check: "What's changing?" @ https://developers.google.com/web/updates/2019/01/user-activation

Upvotes: 6

Lothar Bongartz
Lothar Bongartz

Reputation: 36

You describe the new Chrome behavior.

You now have to click into the iframe manually - either to start playing or to unmute.

To use "autoplay," you have to use "mute" as well. Make sure not to disable "controls," because the user has to click the loudspeaker symbol to enable sound.

Upvotes: 0

Related Questions