Chrome 扩展中的 Youtube 播放器 API [英] Youtube player API in Chrome extension

查看:17
本文介绍了Chrome 扩展中的 Youtube 播放器 API的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我希望在我的 Youtube Chrome 扩展程序中使用 Youtube 播放器 API.
我的目标是能够使用 pageAction 的弹出窗口从我的内容脚本控制 Youtube 网站上的播放器控件.

I'm looking to use the Youtube player API in my Youtube Chrome extension.
My goal is to be able to control the player's controls on Youtube website from my content script using the pageAction's popup.

事情是这样的-
单击弹出窗口中的播放"按钮会向内容脚本发送消息,内容脚本接收消息并使用播放器 API 事件playVideo()"播放视频.

It goes like this -
Clicking on a "play" button in the popup sends a message to the content script, the content script receives the message and use the player API event "playVideo()" to play the video.

由于内容脚本和页面本身是相互隔离的,所以我不能简单地从页面获取播放器的对象,据我所知,我不能使用消息从页面发送对象到内容脚本.

Because of the content script and the page itself are isolated from each other then I can't simply get the player's object from the page, and from what I understand I can't use messages to send an object over from the page to the content script.

现在我可以通过使用 HTML5 视频事件绕过所有这些麻烦,但不幸的是,这不适用于直播,因为 Flash 仍在使用中,所以我别无选择,只能加载和使用播放器 API,我说的对吗?
有没有办法使用 Youtube 网站本身的 URL 参数来控制播放器?
(我真的比加载额外的脚本和外部脚本更喜欢一切)

Now I could bypass all this trouble by using the HTML5 video events, but unfortunately this won't work on live streams since flash is still in use there, so I kind of have no other choice but loading and using the player API, am I correct?
Is there a way to control the player using URL parameters on Youtube site itself?
(I really prefer everything than loading an additional script and external one)

关于代码,我想获得帮助,设置能够加载外部脚本所需的权限.
我看到有需要在manifest文件中声明一个content_security_policy,但是我不明白语法以及如何写下来,所以我想有请举个例子,以及其他任何需要的东西.

Where it comes to code I would like to get help setting the permissions needed to be able to load the external script please.
I saw that there is a need to declare a content_security_policy in the manifest file, but I do not understand the syntax and how to write it down, so I would like to have an example and whatever else is needed for it please.

在我的内容脚本中,我使用来自 YT 播放器 API 文档的下一个代码来注入脚本:

In my content script I'm using the next code taken from the YT player API documentation to inject the script:

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! ---');
}

推荐答案

由于内容脚本无法访问页面javascript对象,因此在页面中注入脚本(官方文档说明如何).注入的脚本可以访问对象,然后可以在 dom 上使用消息传递或写入与内容或弹出窗口进行通信.

Since the content script cant access the page javascript objects, inject a script in the page (the official docs explain how). That injected script has access to the objects and can then use messaging or writting on the dom to communicate with the content or popup.

这篇关于Chrome 扩展中的 Youtube 播放器 API的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆