Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Youtube embed: Unsafe JavaScript attempt to access frame

We have a Wicket app with a page that includes an embedded Youtube video. The video embeds and plays fine, but apparently it causes the rest of the page to not render- it seems that the DOM elements coming after the embed simply don't show up on the page, despite being in the markup.

Looking at the error console in Chrome reveals:

Unsafe JavaScript attempt to access frame with URL http://example.com/detail/COMMUNICATION/search/com-sonyericsson-hanashi from frame with URL http://www.youtube.com/embed/eJY7_De5opI?enablejsapi=1&autohide=1&showinfo=1. Domains, protocols and ports must match.

I've googled this a fair amount, and people seem to be saying that it's innocuous and to ignore it. That just seems wrong, and in our case it actually breaks the page.

If we change our app so that the video is embedded dynamically via an ajax callback (user clicks a Wicket AjaxLink) we still get the error in the console, but at least the page renders fully. Unfortunately this won't work for us, as we need the video to be loaded by default when the user first hits the page.

Edit: I should add that although the error message was taken from the Chrome console, the bug seems to affect every browser I've tried: Chrome, Safari and Firefox.

like image 464
George Armhold Avatar asked Jun 14 '11 15:06

George Armhold


People also ask

Why is my YouTube video not embedding?

If you receive the error message, "Embedding disabled on request” ,you have probably accidentally disabled embedding via YouTube. To grant permission again, follow these steps: Go to “Video Manager.” Select the appropriate video and click “Edit”.

How do I get an iframe embed code from YouTube?

On a computer, go to the YouTube video or playlist you want to embed. From the list of Share options, click Embed. From the box that appears, copy the HTML code. Paste the code into your website HTML.

Why is iframe not allowed?

You cannot bypass embedding sites like google in an iframe because they add x-frame-options headers (deny or sameorigin). Browsers that support those headers simply won't allow it. If you just need to get data from a page and show it, you could get the data server-side, but this is probably not your intentions.

How do I change the embed settings on YouTube?

From the left menu, select Settings . In the Overview section, scroll to Block embedding in apps. Click User-uploaded content and select the rule you want to apply to apps that embed user-uploaded videos claimed against one of your assets: Allow in all apps (default option): No restrictions on embedding in any app.


2 Answers

The security error is unlikely to break your page. It looks like the error is happening from within the YouTube frame, which means that in the worst case the content of the frame will be messed up.

A frame/iframe from an external page cannot, under any circumstances effect the content of the parent document unless they are from the same domain and port number. It is one of the hard rules of browser security.

The error must be elsewhere in your markup. Any chance of seeing some example markup?

[edit]

The error could also be in the embed code markup. Or, if any script tags are included directly on the page (not in the iframe) it could be there.

Usually when problems like this happens it is because of an unclosed tag somewhere but it could be Javascript as well.

like image 150
Andrew Curioso Avatar answered Oct 18 '22 17:10

Andrew Curioso


If you are having an issue resolving that JavaScript error, you can try using YouTube's old embed code. It's an option on every YouTube video once you click on embed. You will not have that error because it does not use iframes. The code would look something like this:

<object width="560" height="315">     <param name="movie" value="http://www.youtube.com/v/9DXL9vIUbWg?version=3&amp;hl=en_US&amp;rel=0"></param>     <param name="allowFullScreen" value="true"></param>     <param name="allowscriptaccess" value="always"></param>     <embed src="http://www.youtube.com/v/9DXL9vIUbWg?version=3&amp;hl=en_US&amp;rel=0" type="application/x-shockwave-flash" width="560" height="315" allowscriptaccess="always" allowfullscreen="true"></embed> </object> 

Hope this helps.

like image 24
Jonathan Torres Avatar answered Oct 18 '22 16:10

Jonathan Torres