使用Youtube API的Chrome扩展程序显示不一致的结果-Java 学习之路

我正在构建一个chrome扩展程序以使用youtube的API . 这是它的工作原理：

通过manifest.json在每个youtube页面上自动注入内容脚本

"permissions": ["tabs", "http://*/*", "https://*/*", "<all_url>", "background"],
"content_scripts": [
  {
    "matches": ["http://www.youtube.com/*"],
    "js": ["inject.js"]
  }
]

我有很多调试点，所以我知道内容脚本和listen.js被加载到每个页面上 .

使用内容脚本，我会注入一段额外的javascript代码来监听播放器状态 . 如果播放器状态发生变化（暂停，播放，结束......），它将被记录在控制台中 .

// inject listen.js into current webpage
var s = document.createElement('script');
s.src = chrome.extension.getURL("listen.js");
s.onload = function() {
   this.parentNode.removeChild(this);
};
(document.head||document.documentElement).appendChild(s);

然后，在listen.js中，我会听取youtube的播放器状态 .

var currentVideo = document.getElementById("movie_player");
currentVideo.addEventListener("onStateChange", "onytplayerStateChange");
function onytplayerStateChange() {
    console.log("state changed");
};

唯一的问题是我不能让它始终如一地运作 . 一些Youtube页面提供有关玩家状态的反馈，而另一些则没有 . 也没有回归模式 . 之前有效的youtube页面可能会再次失败 . 只有当我重新加载扩展程序并在新窗口中打开YouTube视频时，才会在控制台中记录播放器状态 .

在失败的youtube页面上，listen.js中的eventlistener似乎不是活动的 . 如果我尝试在控制台中记录playertate，则会显示以下错误：

#<HTMLEmbedElement> has no method 'getPlayerState'

知道为什么我不能得到一致的结果吗？我的权限有问题吗？

1 回答

1
似乎方法“getPlayerState”没有被触发，因为视频尚未加载 . 要修复它，您只需将addEventListener放在名为“onYouTubePlayerReady（playerID）”的函数中，该函数是YouTube javascript API的一部分 .
```
function onYouTubePlayerReady(playerId) {
    var currentVideo = document.getElementById("movie_player");
    currentVideo.addEventListener("onStateChange", "onytplayerStateChange");
}

function onytplayerStateChange() {
  console.log("state changed");
};
```
回复于 2024-05-14T17:44:35+08:00

使用Youtube API的Chrome扩展程序显示不一致的结果

1 回答

相关问题