Chrome 扩展中的 Youtube 播放器 API
Youtube player API in Chrome extension
我想在我的 Youtube Chrome 扩展程序中使用 Youtube 播放器 API。
我的目标是能够使用 pageAction 的弹出窗口从我的内容脚本控制播放器在 Youtube 网站上的控件。
事情是这样的-
单击弹出窗口中的 "play" 按钮向内容脚本发送消息,内容脚本接收消息并使用播放器 API 事件 "playVideo()" 播放视频。
因为内容脚本和页面本身是相互隔离的,所以我不能简单地从页面获取播放器的对象,而且据我所知,我不能使用消息从内容脚本的页面。
现在我可以通过使用 HTML5 视频事件来绕过所有这些麻烦,但不幸的是,这对直播流不起作用,因为那里仍在使用 flash,所以我别无选择,但加载和使用播放器 API,我说得对吗?
有没有办法在 Youtube 网站上使用 URL 参数来控制播放器?
(我真的更喜欢一切,而不是加载一个额外的脚本和外部脚本)
关于代码,我想获得帮助来设置能够加载外部脚本所需的权限。
我看到需要在manifest
文件中声明一个content_security_policy
,但是我不明白语法和如何写下来,所以我想有一个例子,其他的就可以了请需要它。
在我的内容脚本中,我使用取自 YT 播放器 API 文档的下一个代码来注入脚本:
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
function onYouTubeIframeAPIReady() {
console.log('--- The YT player API is ready from content script! ---');
}
这应该保存在 manifest.json
{
"manifest_version": 2,
"name": "example",
"description": "Lorem Ipsum dollar sit amet",
"version": "0.0",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"permissions": [
"activeTab",
"tabs",
"content_security_policy"
]
}
由于内容脚本无法访问页面 javascript 对象,在页面中注入一个脚本(官方文档解释如何)。注入的脚本可以访问对象,然后可以在 dom 上使用消息传递或写入与内容或弹出窗口进行通信。
我想在我的 Youtube Chrome 扩展程序中使用 Youtube 播放器 API。
我的目标是能够使用 pageAction 的弹出窗口从我的内容脚本控制播放器在 Youtube 网站上的控件。
事情是这样的-
单击弹出窗口中的 "play" 按钮向内容脚本发送消息,内容脚本接收消息并使用播放器 API 事件 "playVideo()" 播放视频。
因为内容脚本和页面本身是相互隔离的,所以我不能简单地从页面获取播放器的对象,而且据我所知,我不能使用消息从内容脚本的页面。
现在我可以通过使用 HTML5 视频事件来绕过所有这些麻烦,但不幸的是,这对直播流不起作用,因为那里仍在使用 flash,所以我别无选择,但加载和使用播放器 API,我说得对吗?
有没有办法在 Youtube 网站上使用 URL 参数来控制播放器?
(我真的更喜欢一切,而不是加载一个额外的脚本和外部脚本)
关于代码,我想获得帮助来设置能够加载外部脚本所需的权限。
我看到需要在manifest
文件中声明一个content_security_policy
,但是我不明白语法和如何写下来,所以我想有一个例子,其他的就可以了请需要它。
在我的内容脚本中,我使用取自 YT 播放器 API 文档的下一个代码来注入脚本:
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
function onYouTubeIframeAPIReady() {
console.log('--- The YT player API is ready from content script! ---');
}
这应该保存在 manifest.json
{
"manifest_version": 2,
"name": "example",
"description": "Lorem Ipsum dollar sit amet",
"version": "0.0",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"permissions": [
"activeTab",
"tabs",
"content_security_policy"
]
}
由于内容脚本无法访问页面 javascript 对象,在页面中注入一个脚本(官方文档解释如何)。注入的脚本可以访问对象,然后可以在 dom 上使用消息传递或写入与内容或弹出窗口进行通信。