TL;DR
Setting origin prevents all video events from firing.
VEVO videos do not work with the YouTube API. Error 150.
I am developing an app using PhoneGap and we are experiencing an issue as of a couple of weeks ago (early December 2015).
When we were first developing the app, we noticed VEVO videos weren't working with our API integration and found documentation online that stated we should set the origin. We set the origin to our website (in ~November 2015) and it seemed to have fixed the issues for us. At that point in time, VEVO videos worked and the events from the videos worked (onReady, onStateChange, etc.).
However, as of a couple of weeks ago (early December 2015), the API onReady and onStateChange events were NOT firing anymore and the app not working with YouTube videos. At that point, I found that if I removed the origin: sample.com code from the playerVars section of the new YT.Player, the onReady and onStateChange events worked again, but VEVO videos did not.
I have also tried every other solution that people have offered to no avail. As it stands, we can not play VEVO videos with the YouTube API no matter what we try. When the API tries to play VEVO videos, it spits out an error code "150". Also, if we set the origin, it completely breaks the YouTube API events and thus our app ceases to function.
This MUST be some sort of change on YouTube's end as we noticed this issue pop up without changing any code in the app.
Please help as now we have hit a brick wall with our app.
VEVO strikes again...
Below is some of the code that we use to create the YT Player.
//load YT api asynchronously
var yt_tag = document.createElement('script');
yt_tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(yt_tag, firstScriptTag);
yt_player = new YT.Player(playlist[playlist_index].yt_id, {
height : '220',
width : (jQuery('#playlist').width() * .98),
videoId : playlist[playlist_index].yt_id,
playerVars : {
//controls: 0,
//'enablejsapi' : 1,
'wmode' : 'transparent',
//'origin' : 'http://example.com',
//'rel' : 0
},
//autoPlay: true,
events : {
'onError' : function(event) {
if (dev_mode) alert(event.data);
},
'onReady' : function(yt_event) {
//this doesnt work
},
'onStateChange' : function(event) {
//this doesnt work
}
}
});
