由于来源限制，您不能使用<object>元素。相反，嵌入一个<iframe>并使用 YouTube 播放器 API 与框架进行通信。
更换你的function onYouTubePlayerReady and function Initialize(playlist)与以下内容（在background.js http://pastebin.com/cQFZQWQe):
function Initialize(playlist) {
port = chrome.extension.connect({ name: "statusPoller" });
if (!player) {
YT_ready(function() {
var frameID = getFrameID("MusicHolder");
if (frameID) {
player = new YT.Player(frameID, {
events: {
"onReady": function() {
player.cueVideoById(playlist[0].ID, 0);
},
"onStateChange": onPlayerStateChange
}
});
}
});
} else {
// Only reload if the player is not playing. Otherwise, the music
// stops when re-opening the popup.
if (player.getPlayerState && player.getPlayerState() != PLAYING) {
player.cueVideoById(playlist[0].ID, 0);
}
}
}
要使之前的代码正常工作，您必须加载另一个脚本background.htm http://pastebin.com/rWJNpc1G。的内容youtube-player-api-helper.js http://pastebin.com/KfsRj9rD基于我之前的回答使用 JavaScript 或 jQuery 监听 Youtube 事件 https://stackoverflow.com/a/7988536/938089?listening-for-youtube-event-in-javascript-or-jquery:
// @description Easier way to implement the YouTube JavaScript API
// @author Rob W
// @global getFrameID(id) Quick way to find the iframe object which corresponds to the given ID.
// @global YT_ready(Function:function [, Boolean:qeue_at_start])
// @global onYouTubePlayerAPIReady() - Used to trigger the qeued functions
// @website https://stackoverflow.com/a/7988536/938089?listening-for-youtube-event-in-javascript-or-jquery
function getFrameID(id) {
var elem = document.getElementById(id);
if (elem) {
if(/^iframe$/i.test(elem.tagName)) return id; //Frame, OK
// else: Look for frame
var elems = elem.getElementsByTagName("iframe");
if (!elems.length) return null; //No iframe found, FAILURE
for (var i=0; i<elems.length; i++) {
if (/^https?:\/\/(?:www\.)?youtube(?:-nocookie)?\.com(\/|$)/i.test(elems[i].src)) break;
}
elem = elems[i]; //The only, or the best iFrame
if (elem.id) return elem.id; //Existing ID, return it
// else: Create a new ID
do { //Keep postfixing `-frame` until the ID is unique
id += "-frame";
} while (document.getElementById(id));
elem.id = id;
return id;
}
// If no element, return null.
return null;
}
// Define YT_ready function.
var YT_ready = (function() {
var onReady_funcs = [], api_isReady = false;
/* @param func function Function to execute on ready
* @param func Boolean If true, all qeued functions are executed
* @param b_before Boolean If true, the func will added to the first
position in the queue*/
return function(func, b_before) {
if (func === true) {
api_isReady = true;
for (var i=0; i<onReady_funcs.length; i++){
// Removes the first func from the array, and execute func
onReady_funcs.shift()();
}
}
else if(typeof func == "function") {
if (api_isReady) func();
else onReady_funcs[b_before?"unshift":"push"](func);
}
}
})();
// This function will be called when the API is fully loaded
function onYouTubePlayerAPIReady() {YT_ready(true);}
// Load YouTube Frame API
(function() { //Closure, to not leak to the scope
var s = document.createElement("script");
s.src = "http://www.youtube.com/player_api"; /* Load Player API*/
var before = document.getElementsByTagName("script")[0];
before.parentNode.insertBefore(s, before);
})();
额外变更的说明（奖励）：
-
background.htm: <!DOCTYPE html />是无效的。它应该是：<!DOCTYPE html>.
-
All
.htm files: The type属性是可选的<script>标签。即使您想指定一个，也可以使用application/javascript代替text/javascript。两者都可以在 Chrome 扩展中使用，但第一个更正确。
-
popup.js: Changed detection of ctrl+c. Instead of detecting and remembering whether Ctrl was pressed, use the e.ctrlKey property.
- 还有更多。看一下popup.js http://pastebin.com/kVwtEK9e，并搜索
RobW:找到我的注释。
修改文件
更新文件摘要（基于您的Github 仓库 https://github.com/MeoMix/YouPod/tree/master/YouPod):
- YouPod/background.htm http://pastebin.com/rWJNpc1G
-
YouPod/popup.htm http://pastebin.com/grrZAVn9 （文档类型修复，占位符焦点的评论建议）
- YouPod/js/background.js http://pastebin.com/cQFZQWQe
- YouPod/js/popup.js http://pastebin.com/kVwtEK9e
-
YouPad/js/youtube-player-api-helper.js http://pastebin.com/KfsRj9rD New
