Embedded YouTube not autoplaying

[Robert_Simpson]

Before completing please check that the time, date and timezone have been correctly set on the device running the Player.

To be completed by the original poster:

Player Version

3R30.1 upgraded from 2R232

Issue

I am unable to play embedded YouTube videos automatically from the player. The error is “your browser can’t play this video”. I am open the layout htm file manually by double clicking on it and it will play It also plays if I copy the embed string and paste in a browser window. The video plays automatically in the layout design window, but does not play on preview.

I have tried the " Autoplay Embedded Youtube Videos" instructions here: Autoplay Embedded Youtube Videos | Xibo Digital Signage as well as other suggestions found through several hours of searching.

The server version is 2.3.3.

This is the embed code I am using at the moment:

>  <iframe width="1920" height="1080" 
>  	src="https://www.youtube.com/embed/R2HtWbsJsyA?rel=0&modestbranding=1&autohide=1&mute=0&showinfo=0&controls=0&autoplay=1&enablejsapi=1" 
>  	title="YouTube video player" 
>  	frameborder="0" 
>  	allow="accelerometer; 
>  		autoplay; 
>  		clipboard-write; 
>  		encrypted-media; 
>  		gyroscope; 
>  		picture-in-picture" 
>  		allowfullscreen>
>  </iframe>

I have also tried this:

> <!--BROWSER=edge-->
> <div id="player"></div>
> 
> <script>
>       var tag = document.createElement('script');
>       tag.src = "https://www.youtube.com/iframe_api";
>       var firstScriptTag = document.getElementsByTagName('script')[0];
>       firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
>       var player;
>       function onYouTubeIframeAPIReady() {
>        player = new YT.Player('player', {
>        height: '1080',
>        width: '1920',
>        videoId: '6vbLmE8yERo',
>        playerVars: { 
>          'playlist': '6vbLmE8yERo',
>          'autoplay': 1,
>          'start': 0,
>          'loop': 1,
>          'controls' : 0, 
>          'rel' : 0,
>          'fs' : 0,
>          'showinfo' : 0,
>          'cc_load_policy' : 0,
>          'iv_load_policy' : 3,
>          'modestbranding' : 1
>         },
>           events: {
>             'onReady': onPlayerReady
>           }
>         });
>       }
>       function onPlayerReady(event) {
>         event.target.playVideo();
> 	event.target.loadPlaylist(['6vbLmE8yERo']);
> 	event.target.setLoop(true);
>       }
> </script>

I tried with mute=0 with no success. This was suggested on a for video when I got to page two of Google. It would help since I need the sound as well as the video.

Any help would be appreciated.

[ianniow]

I also have this problem and have checked the all the region timezone etc is chacked corectly

[clickandsimple]

Did anyone ever get this working?
I’m running into the same problem and have tried both the iframe and script methods mentioned here.
I’ve tried setting the browser to edge and IE, no difference.

[bigolbug]

Bump,

I am also experiencing problems playing YouTube videos on a Windows player R301 all running on an Azulle Access 3.
Here are my case details. I am trying to stream a live feed from YouTube. It appears as though using the chrome based browser (CEF) will pull up the video but display “Your browser can’t play this video” if I have specified autoplay in the src url. If I insert the “” the player displays a black screen and even “crashes” the xibo application. Looking in the windows event viewer, when xibo terminates, I am seeing an error code 1026 (Link to forum Discussion). On this forum they recommend eliminating third party applications interfering with a clean boot (Link to clean boot instructions). Unfortunately these steps did not allow xibo to play the youtube stream using edge.

[bigolbug]

I found a band aid. Version R201 will work for my application. I uninstalled R301 and installed R201.

[mattgrimley]

Hi @Robert_Simpson
Did you make any progress on this short of downgrading the client? I’m having the exact same issue.
CMS v3.0.5
Client v3-R301.1-win32-x86
Windows v 10 21H1 Build 19043.1237
Trying the same examples at Autoplay Embedded Youtube Videos | Xibo Open Source Digital Signage.
Simply get a black screen on either of the examples and a “Your video can’t be played” using a standard embed with:

<iframe width="600px" height="400px" src="https://www.youtube.com/embed/9Auq9mYxFEE?autoplay=1&cc_load_policy=1&controls=0" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Is it to do with the old Edge no longer existing and Edgemium being installed?

Matt

[mattgrimley]

Hi @dan - Sorry to tag you in this, but is this the kind of thing that would be better reported on Github? I can’t see anything over there referring to it, though, judging by the “Autoplay Embedded Youtube Videos” document, it’s obviously not totally new.
Happy to go do a full issue report over there rather than tag on the bottom of this possibly community help request.

Thanks in advance,
Matt

[dan]

Apologies for the delay, I was out of the office over the new year break.

We did discover this problem back in November and have a task to update our docs with a new script, shown below for convenience:

<script>
      var tag = document.createElement('script');
      tag.src = "https://www.youtube.com/iframe_api";
      var firstScriptTag = document.getElementsByTagName('script')[0];
      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
      var player;
      var playerState = -1;
      var readyCalled = false;
      function onYouTubeIframeAPIReady() {
        player = new YT.Player('player', {
          suggestedQuality: 'hd1080',
          height: '1080',
          width: '1920',
          videoId: '9Auq9mYxFEE',
          events: {
            'onReady': onPlayerReady,
            'onError': onError,
            'onStateChange': onPlayerStateChange
          }
        });
      }
      function onPlayerReady(event) {
        console.log('onPlayerReady');
        readyCalled = true;
        event.target.playVideo();
      }
      function onError(event) {
         console.log('Error');
         console.log(event);
      }
      function onPlayerStateChange(event) {
         console.log('Player Status: ' + event.data);
         if (readyCalled && playerState === 3 && event.data === -1) {
            console.log('Buffering failed, restarting');
            setTimeout(function() { player.playVideo(); }, 1000);
         }
         playerState = event.data;
      }
</script>

It isn’t clear why but for some reason buffering fails sometimes - I suspect its some load ordering gremlin between WinForms and WFP.

Thanks for taking the time to report on GitHub.

Cheers,
Dan