YouTube Iframe API onError event does not fire in recent months

user_3981152 0
Viewed 709

I'm pretty sure YouTube Iframe API "onError" event will fire in the past since I run a project based on this API. But recently "onError" event will not fire, even the simplest error.

This is a simple sample code based on official page( https://developers.google.com/youtube/iframe_api_reference ) and is workable:

<iframe id="existing-iframe-example"
        width="640" height="360"
        src="https://www.youtube.com/embed/M7lc1UVf-VE?enablejsapi=1"
        frameborder="0"
        style="border: solid 4px #37474F"
></iframe>

<script type="text/javascript">
  var tag = document.createElement('script');
  tag.id = 'iframe-demo';
  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('existing-iframe-example', {
        events: {
          'onReady': onPlayerReady,
          'onStateChange': onPlayerStateChange,
          'onError': onError
        }
    });
  }
  function onError(event) {
    console.log(event.data)
  }
  
  function onPlayerReady(event) {
    
  }

  function onPlayerStateChange(event) {
    console.log(event.data);
  }
</script>

Once change the video id string "M7lc1UVf-VE" as a wrong one, such as "M7lc1UVf", it should fire "onError" event, but doesn't now.

According to official page guide: https://developers.google.com/youtube/players/support → "Google engineers monitor and answer questions with the youtube-iframe-api tag", hope Google engineers can see this post and fix the "onError" problems.

youtube-iframe-api javascript
2 Answers

I found a workaround for this. I found that, at least in my case, the onError callback doesn't fire on initial load (when it's most needed!) but will fire after the rest of the player loads completely.

If you absolutely need the onError event to work, you can reload the video within a loaded player. Remove the autoplay param from the playerParams object-- this causes the hack to fail. Add loadByVideoId (for autoplay) or cueByVideoId with the same video id to the onReady callback.

This will reload the current video and the onError callback will fire if needed. Otherwise, there will be little to no noticeable effect--other than the video being briefly cued before it plays if autoplay is expected.

Let me know if you'd like more info-- hope that helps!

EDIT:

UPDATE: I don't know when it happened-- the devs at Google never updated my issue-- but it looks like this bug may have been resolved. The first demo now lists the error code on load as expected. For anyone that implemented this workaround, you may be able to remove the hack now.

user_73474840

You need to load the page from a server (not local). Just change it to not load locally.

I was having the same issue, and realized that if I'm loading the page locally most error events wont raise. If I load the page from my azure server, the errors are correct. Also, some videos will not work/load at all if the html is locally loaded.

user_151057920
Related