javascript - 使用 Javascript 在 Youtube 网站内检测 Youtube 视频的结尾

Question

我想用 Javascript 检测我在 Youtube 网站上观看的 Youtube 视频的结尾。

我知道他们有一个 API，我试图用 GreaseMonkey 将它加载到页面中，但它似乎不起作用。也许该 API 仅适用于其他网站上的嵌入视频？

这是我目前所拥有的:

if (window.location.href.indexOf("&enablejsapi=1") == -1)
  {
    window.location = window.location.href + "&enablejsapi=1";
  }

var api = document.createElement('script');
api.type = 'text/javascript';
api.src = "https://www.youtube.com/iframe_api";
document.body.appendChild(api);

var onFinish = document.createElement('script');
onFinish.type = 'text/javascript';
var onFinishContent = "function onPlayerStateChange(event) { console.log('test'); if (event.data == YT.PlayerState.ENDED) { console.log('end'); } }"
var textNode = document.createTextNode(onFinishContent);
onFinish.appendChild(textNode);
document.body.appendChild(onFinish);

function onPlayerStateChange(event)
{
  console.log("test");
  if (event.data == YT.PlayerState.ENDED)
    {
      console.log("end");
    }
}

如您所见，我尝试通过两种方式使 onPlayerStateChange 函数可调用，一种是直接使用 Greasemonkey，另一种是通过注入(inject)脚本节点。它们都不起作用，我从未在控制台中看到显示的“测试”消息。

有谁知道为什么我似乎无法加载 API？

Answer 1

Sebastian Simon 在 2015 年的评论-回答:

document.querySelector("video").addEventListener("ended",
    () => alert("Video ended!")});

我检查过这在 2022 年仍然有效。