PDA

View Full Version : Embedding YouTube video... getting error



wyclef
Jan 27th, 2017, 06:33 PM
Hey, I'm embedding a YouTube video that seems to play and function fine but the web console is spitting out the following error.

Failed to execute ‘postMessage’ on ‘DOMWindow’: The target origin provided (‘https://www.youtube.com’) does not match the recipient window’s origin (‘http://www.mywebpage.org’). www.mywebpage.org

Wondering why that might be? This is the embed code:



<div id="video-featured" data-video-id="XXXXXXXXXXXX"></div>

<script type="text/javascript">

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

// This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

// This function creates an <iframe> (and YouTube player)
// after the API code downloads.
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('video-featured', {
height: '280',
width: '500',
playerVars: { 'showinfo': 0, 'rel': 0, 'autoplay': 0, 'enablejsapi': 1 },
videoId: 'XXXXXXXXXXXX',
events: {
'onStateChange': onPlayerStateChange
}
});
}

// The API calls this function when the player's state changes.
// The function indicates that when playing a video (state=1),
// the player should play for six seconds and then stop.
var done = false;
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING && !done) {
done = true;
}
}
function stopVideo() {
player.stopVideo();
}
</script>

</div>

deathshadow
Jan 28th, 2017, 03:08 AM
It's a common error in their code. The error itself is complaining that their script is unable to pass a value from inside the iframe to the page the iframe is on... something that any decent browser of the past fifteen years would be blocking and complaining about in the first place.

Scripting errors from sites like Youtube are something that, well... are so ridiculously commonplace you have to wonder if anyone working here has ever even bothered opening the browser console to double-check themselves. Eventually you just learn to live with it.

Though since that scripted mess just makes an iframe with JavaScript, why not just use the direct iframe method? I mean if you're going to have a tag we were told in 1998 to stop using, go high hog and just use it... I mean that's one giant load of scripttardery for little more functionality than:



<iframe id="ytplayer" type="text/html" width="500" height="280"
src="https://www.youtube.com/embed/XXXXXXXXXXXX?autoplay=0&origin=http://yourDomainHere"
frameborder="0"></iframe>


Provides.

wyclef
Jan 28th, 2017, 03:13 PM
That is a really good idea that I will try. I don't understand why they don't update that trash. I think that there might be some onplayerstate change code in there that isnt included in just the iframe? Will have to see if it is being used currently.