Question

Here I am with another question, this time about the youtube API.
I’m using this code to get a youtube player:

<div id=\"youtubeVideoContainer\"></div><script type=\"text/javascript\">
                        //Load player api asynchronously.
                        var tag = document.createElement('script');
                        tag.src = \"//www.youtube.com/player_api\";
                        var firstScriptTag = document.getElementsByTagName('script')[0];
                        firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

                        var player;
                        function onYouTubePlayerAPIReady() {
                            player = new YT.Player('youtubeVideoContainer', {
                              height        : \"".$height."\",
                              width         : \"".$width."\",
                              videoId       : \"".$id."\",
                              playerVars    : ".json_encode($this->playerParams)."
                            });
                        }
                    </script>

Please don’t mind the \”, it is rendered in PHP, so it’s just for escaping, also, the video is playing, so no major errors 🙂

What does annoy me, is everytime I request a video, I see this message in my console:
Unsafe JavaScript attempt to access frame with URL

https://www.socialthisday.com/playwin/admin/content/edit/project_1/home.html
from frame with URL
https://www.youtube.com/embed/2UJH9dCtp7w?autohide=1&autoplay=1&controls=0&border&cc_load_policy=0&color&color1&color2&disablekb&enablejsapi=1&egm&fs&hd&iv_load_policy&loop&modestbranding=1&origin=https%3A%2F%2Fwww.socialthisday.com&playerapiid&playlist&rel=0&showinfo=0&showsearch&start&theme&version=3.
Domains, protocols and ports must match.

I would like to fix this so I don’t see that message. I know it isn’t really a major thing, but I like to now how I can get a youtube player on my site without seeing the warning above.

Hopefully you guys can help me out!

EDIT:
This is the output:

<div id="YTcontainer_502513c7ebc1b">&nbsp;</div>
                        <script type="text/javascript">
                            //Load player api asynchronously.
                            var tag = document.createElement('script');
                            tag.src = "//www.youtube.com/iframe_api";
                            var firstScriptTag = document.getElementsByTagName('script')[0];
                            firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

                            var YTplayer_502513c7eb834;                                                        
                            window.onYouTubeIframeAPIReady = function() {
                                YTplayer_502513c7eb834   = new YT.Player("YTcontainer_502513c7ebc1b", {
                                  height        : "200",
                                  width         : "200",
                                  videoId       : "2UJH9dCtp7w",
                                  playerVars    : {"autohide":1,"autoplay":1,"controls":0,"border":"","cc_load_policy":0,"color":"","color1":"","color2":"","disablekb":"","enablejsapi":"","egm":"","fs":"","hd":"","iv_load_policy":"","loop":"","modestbranding":1,"origin":"","playerapiid":"","playlist":"","rel":0,"showinfo":0,"showsearch":"","start":"","theme":"","version":3,"wmode":"opaque"}
                                });
                            }

                            if(window.YT){
                                onYouTubeIframeAPIReady();
                            }
                        </script>

Answer 1

The underlying issue is http://code.google.com/p/chromium/issues/detail?id=17325

Once that’s resolved, the warnings in the JavaScript console on pages that use the YouTube iframe embed should go away—certainly for Chrome, and I believe for Safari as well.