Cannot access YouTube videos through YouTube JS API inside Google Chrome extension, but may be inside JS Fiddle

Question

I’m trying to understand the logic of any disabling the YouTube video blocking mechanism.

Here I am trying to play a song that is locked from inline playback inside JS Fiddle. Note that it works:

http://jsfiddle.net/E7B9C/17/

Now I use the same code inside my Google Chrome extension:

http://www.meomixes.com/ if you want to click to download the extension.

http://www.meomixes.com/Test.crx for a direct link to the extension.

Please note that I cannot play the same YouTube video:

I was wondering what my debugging options were for this scenario. Does anyone have any ideas on what I should research? I tried to request the following permissions in my manifest, but this had no effect:

"permissions": [ "http://*.youtube.com", "https://*.youtube.com", "http://*.google.com", "https://*.google.com" ] 

I have posted the full source Test.crx here: http://www.meomixes.com/Test.zip Download:

• Unpack
• Go to the Google Chrome extension page and enable "Developer Mode"
• Click "Download Unpacked Extension" and specify the folder without unpacking.
• Please note that the video does not play.

Last note: the song plays well in a Facebook post.

EDIT: I found this: http://gdata.youtube.com/feeds/api/videos/UfESt2KdOdc?v=2&prettyprint=true for the video in question. It combines with: http://apiblog.youtube.com/2011/12/understanding-playback-restrictions.html .

Just build the first answer. Basically, there is a setting called "syndication" that prevents playback on "external devices" such as televisions and Google Chrome extensions.

Consider ways to get around this problem now.

Answer 1

The Youtube iframe implementation seems to block certain link URLs from displaying licensed content.

Problem

These link schemes do not seem to work with the specific video you are testing.

  chrome-extension:// file:// 

It seems that the content licensor, UMG, has decided to prevent any games from extensions or local files. An alternative is to avoid using videos containing licensed content, but this is boring.

This is inconvenient, but there is a workaround that will allow you to implement an iframe player in the extension. All Youtube takes care that the player is embedded on a page somewhere on the Internet.

Proxy page

Try replacing the iframe src in popup.htm with the jsfiddle result frame from your example and reloading the plugin.

  <iframe width="200" height="200" src="http://fiddle.jshell.net/E7B9C/17/show/"></iframe> 

You should now see the previous “inaccessible” video. Your extension now links to a page that you control on jshell.net. All that Youtube knows is that you call your player with jshell.net.

Control

Now that we have the player, you may notice that you do not have Youtube controls available, as you are now referencing your own iframe, referencing the Youtube iframe and its API. As if it wasn’t fun enough, now you can make your own iframe API to communicate with the chrome extension to your iframe to Youtube iframe!

Under normal conditions, the parent can set the window.location.hash child frame, and this frame looks and analyzes any changes that occur. The child then calls the callback in the parent directly with some new information.

Edit: Instead of using window.location.hash, you can use HTML5 window.postMessage () instead and avoid the need to constantly check and analyze the hash.

This should make you work and work.