Question

因此，我正在开发chrome扩展程序。我正在尝试获取Youtube视频的当前播放时间

我知道在其他帖子中也有很多类似的问题，但是它们的代码都不适合我

我的代码是这样的，我必须先将我的代码注入到内容脚本中

chrome.tab.query({highlighted: true}, tabs => {
   tab = tabs[0]
   chrome.tabs.executeScript(tab.id, {code: "temp = 
                             document.getElementById('movie_player'); 
alert(temp); alert(temp.getCurrentTime());"}, respond => {});
}

因此，当我运行此命令时，我会收到一条警告，提示[object HTMLDivElement]。但不会从temp.getCurrentTime（）中得到任何信息。

Answer 1

问题：

元素是一个复杂的对象，因此alert（）无法以有意义的方式显示它，这就是为什么看到[object HTMLDivElement]的原因。无论如何，您不需要它，我想这是一个测试。
实际的问题是#movie_player是一个<div>，其中很多YouTube Player API函数在页面上下文中显示为，但在孤立的世界中却不存在运行所有内容脚本的位置。要访问页面上下文，您必须自己use a page script，这不必要地复杂。

解决方案：

访问<video>元素，该元素将currentTime公开为标准DOM属性，因此它既可以在页面上下文中使用，也可以在内容脚本的隔离世界中使用。然后，使结果成为code字符串中的最后一个表达式，从而将结果传输到回调中：

chrome.tabs.executeScript({
  code: 'document.querySelector("video").currentTime'
}, results => {
  const time = results && results[0];
  console.log(time);
});

结果应为简单类型，例如字符串/数字/布尔值/空值或由此类简单类型组成的数组/对象，这意味着您无法传输DOM元素和函数；
结果应在回调内部使用，因为它是异步调用的，这意味着它在外部代码完成后在以后的某个时间运行，更多信息：Why is my variable unaltered after I modify it inside of a function? - Asynchronous code reference;
如果您始终要处理活动标签，则无需在executeScript（）中指定tabId，因此也不需要chrome.tabs.query（）。

返回多个属性：

chrome.tabs.executeScript({
  code: `(${() => {
    const el = document.querySelector('video');
    return {
      time: el.currentTime,
      duration: el.duration,
    };
  }})()`
}, results => {
  const info = results && results[0];
  console.log(info);
});

Answer 2

以下代码在控制台中显示youtube播放时间

[Route("api/[controller]")]

获取youtube视频播放的当前时间

2 个答案:

问题：

解决方案：

返回多个属性：