Menu
When embedding a Youtube playlist I am getting this error:
Blocked a frame with origin "http://www.youtube.com" from accessing a frame with origin "http://www.mydomain.com". Protocols, domains, and ports must match.
I am not mixing HTTP with HTTPS anywhere, so I don't know why I am getting this error in the first place.
I have noticed that recently the Youtube embedded playlist is not displaying the embed image of the first video and just displaying a black screen with a 'Play All' button, and I am wondering if this is being caused by the above error.
732
The 'blocked a frame with origin "null" from accessing a cross-origin frame` error occurs because of `Cross-originn` request. To solve this error, you have a number of solutions like using a `local web server` or using the browser with `cross domain web security` disabled few solutions to number.
Same-Origin Policy (SOP) restricts how a document or script loaded from one origin can interact with a resource from another origin.
Apparently it seems that the error given by chrome is a bug. In order to solve the black screen with 'Play All' button issue I used the Javascript API (instead of the iframe), like this:
<!DOCTYPE html>
<html>
<body>
<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: '390',
width: '640',
videoId: '',
events: {
'onReady': onPlayerReady
}
});
}
function onPlayerReady(event) {
player.cuePlaylist({'listType':'playlist','list':'PLE2714DC8F2BA092D'});
}
</script>
</body>
</html>
Thanks to @jlmcdonald for the answer, as indicated here: Youtube embedded playlist diplays playall button instead of the first video
191
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With