YouTube iframe api - why is onError event being called twice?

Question

I'm having some trouble with the onError event in the YouTube api. Below is a script with a fake videoId to create an error which calls the function onPlayerError. Unfortunately I can't understand why the error function gets called twice. I think it may be something to do with the callback response being inside a function (maybe?) but neither the onReady or onStateChange get called twice when the videoId is correct. Can anyone see any obvious issues? Thanks in advance.

BTW: yes I do need the callback and the response inside the callback. This is a shortened version of my complete script.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">

<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<!-- jQuery -->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

<!-- jQuery / javascript for page -->
<script type='text/javascript'>
//<![CDATA[ 

//create deferred object
var YTdeferred = $.Deferred();

//attach a function to onYouTubeIframeAPIReady
window.onYouTubeIframeAPIReady = function() {
    //resolve when youtube callback is called passing YT as a parameter
    YTdeferred.resolve(window.YT);
    console.log('Resolved');
};

//embed youtube api 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);

//create player variable
var player;

//create YouTube player
function createyoutubeplayer(nextPageToken)
{
    //whenever youtube callback was called = deferred resolved
    //your custom function will be executed with YT as an argument
    YTdeferred.done(function(YT) {
    console.log("create player");
        //create new player
        player = new YT.Player('player', {
            height: '390',
            width: '640',
            videoId: 'fff',
            playerVars: {
                'rel': 0,
                'autohide': 1,
                'controls': 1,
                'showinfo': 0,
                'iv_load_policy': 3,
                'fs': 0,
                'modestbranding': 0,
                'playsinline': 1,
                'enablejsapi': 1
            },
            events: {
                'onError': onPlayerError,
                'onReady': onPlayerReady,
                'onStateChange': onPlayerStateChange
            }
        });
    });
}

//when YouTube player is ready
function onPlayerReady(event)
{
    //play video
    event.target.playVideo();

    //unmute sound and set the volume
    event.target.unMute();
    event.target.setVolume(80);
}

//when YouTube video ends
function onPlayerStateChange(event)
{       
    //if finished playing     
    if(event.data === 0)
    {     
        //call next video function       
        //nextvideo(event);
    }
}

function onPlayerError(event)
{
    //call next video function  
    //nextvideo(event);
    console.log('Error: ' + event.data);
    player.stopVideo();
}


createyoutubeplayer();

//]]>  
</script>

</head>

<body>

    <!-- video player -->
    <div id="player"></div>

</body>
</html>

Is the onError function throwing the same response twice? One explanation could be that, the onError function is encountering 2 separate errors which leads it to being called twice. Can you update us on what errors you're encountering with the log output of the error? — pointNclick
Error 2 refers to this: "The request contains an invalid parameter value. For example, this error occurs if you specify a video ID that does not have 11 characters, or if the video ID contains invalid characters, such as exclamation points or asterisks." Wonder if it'll throw that error twice for more than one character. However, something is definitely wrong with your Video ID or other parameters which needs to be fixed. — pointNclick
@garrettlynch did you ever figure this out? I'm currently struggling with this — Shakeel
No I didn't. I stopped working on it because of a bigger issue of YouTube API not distinguishing between recorded videos and live broadcasts. The latter of these were new at the time so I'm waiting for the API to catch up. I think all I managed to do for the errors repeating was to write a script which would ignore the one of the errors if they were the same - not particularly elegant. — garrettlynchirl
Same here, happens only when error code is 2. On other errors it only runs once. Anyone? — RobbTe

Paulo St Paulo St · Accepted Answer · 2018-04-11T22:37:00

I think you are missing the Listener.

player.addEventListener(event:String, listener:String):Void

https://developers.google.com/youtube/iframe_api_reference#addEventListener

YouTube iframe api - why is onError event being called twice?

1 Answers