Javascript 检测任何网站上youtube视频的播放状态

我想写一个web扩展，它能够检测用户访问的任何youtube视频的播放状态。我查看了youtube API，但似乎我只能访问自己嵌入的youtube视频。然而，在这种情况下，我没有嵌入它们

---

有什么方法可以做到这一点吗？

好吧，那就自己嵌入视频吧！ 你可以在youtube框架加载之前使用内容脚本修改它，甚至更好。。。 我不确定youtube api是如何工作的，但您可能可以使用截获视频请求并更改请求数据以获得所需内容

如果你提供更多的信息，我可以给你更多的细节如何做到这一点

---

祝你好运

自从有人问这个问题以来，我一直对这个问题很感兴趣，今晚在我们当地的GDG上，我们举办了一次Chrome扩展hackathon，我在那里做了一些试验。这是我发现的

A） 扩展沙箱真的很难；我尝试过的任何东西都无法获取编码到页面中的javascript（如果存在的话）

B） 在某些情况下，一种非常有效的解决方案是使用内容脚本进行代码注入，并在现有的iframe嵌入上设置您自己的侦听器。类似这样的工作原理：

var regex = /https?:\/\/(?:[0-9A-Z-]+\.)?(?:youtu\.be\/|youtube\.com\S*[^\w\-\s])([\w\-]{11})(?=[^\w\-]|$)(?![?=&+%\w]*(?:['"][^<>]*>|<\/a>))[?=&+%\w]*/ig;
var node, nodes = document.evaluate("(//iframe/@src)",document,null,XPathResult.UNORDERED_NODE_ITERATOR_TYPE,null);
var hasvid=false,vids = [];

while (node=nodes.iterateNext()) { // uses regex to run through DOM, looking for embeds
    if (regex.test(node.nodeValue)) {
       hasvid=true;
       vids.push(node.ownerElement);
    }
}
// Now inject a script that sets up a YT.player object and bind it to our extension's functions
if (hasvid) {
   playerlines=['function onYouTubePlayerAPIReady() {'];
   for (i=0;i<vids.length; i++) {
      playerlines.push('player = new YT.Player(\''+vids[i].id+'\', { events: {\'onStateChange\': onPlayerStateChange}});}');
    }
  callbacklines=['function onPlayerStateChange(event) {',
         'if (event.data == YT.PlayerState.ENDED) { alert(\'video is over\'); }',
         'else if (event.data == YT.PlayerState.PAUSED) { alert(\'player is paused\'); }',
         'else if (event.data == YT.PlayerState.PLAYING) { alert(\'player is playing\'); } }'];
  //  notify the background page to actually do the injecting of the script
  chrome.extension.sendRequest({}, function(response) {});
  codelines=playerlines.concat(callbacklines);
  var actualCode=codelines.join('\n');
  var script = document.createElement('script');
  script.textContent = actualCode;
  var jsapi = document.createElement('script');
  jsapi.src = "http://www.youtube.com/player_api";
  (document.head||document.documentElement).appendChild(jsapi);
  (document.head||document.documentElement).appendChild(script);

var regex=/https？：\/\/（？：[0-9A-Z-]+\）（？：youtu\.be\/|youtube\.com\S*[^\w\-\S]）（[\w\-]{11}）（？=[^\w\-]\$）（？！[？=&+%\w]*（？：['''''.[^]*>>）[？=&%\w]*/ig；
var节点，nodes=document.evaluate（（//iframe/@src）”，document，null，XPathResult.UNORDERED\u node\u ITERATOR\u TYPE，null）；
var hasvid=false，vids=[]；
而（node=nodes.iterateNext（））{//使用正则表达式在DOM中运行，查找嵌入
if（正则表达式测试（node.nodeValue））{
hasvid=true；
视频推送（节点所有权）；
}
}
//现在，插入一个脚本来设置YT.player对象，并将其绑定到扩展的函数
如果（hasvid）{
playerlines=['函数onYouTubePlayerAPIReady（）{']；
对于（i=0；i@Sudarshan不，该方法仅适用于IFrame嵌入（特别是使用
&enablejsapi=1
查询字符串参数）。该方法依赖于
contentWindow.postMessage
，但
contentWindow
未定义内容脚本。@RobW:Oh..my bad，删除我的注释