在内容脚本中使用 chrome.tabs 或其他 chrome API 时“无法读取未定义的属性”

IT技术 javascript google-chrome google-chrome-extension
2021-01-16 23:01:57

chrome.tabs 尽管我在权限块中设置了选项卡,但返回未定义。

"permissions": [
    "tabs",
    "http://*/*",
    "https://*/*"
],
"content_scripts": [
    {
        "matches": [
            "http://*/*",
            "https://*/*"
        ],
        "js": [
            "js/myScript.js"
        ],
        "all_frames": true
    }
],

但在 myScript.js 中,以下返回未定义。

chrome.tabs   
4个回答

由于内容脚本有其自身的局限性,

chrome.tabs 仅在后台脚本和弹出脚本中可用。

如果你想使用chrome.tabs然后将消息从 content_script 传递到后台脚本并使用chrome.tabs.

只是补充一下 - 我曾尝试页面内调用debugger之前使用s ,那是我成为. 当我不间断地运行该代码时,它似乎工作正常(同样,仅在页面内)chrome.tabsbackgroundchrome.tabsundefinedbackground
2021-03-24 23:01:57
内容脚本的 API 文档包含有关使用chrome.tabsAPI 的说明,这有点令人困惑...
2021-03-27 23:01:57
这是不正确的。 chrome.tabs在弹出脚本中未定义。
2021-04-04 23:01:57
我反对这个,因为我从谷歌官方 api 文档中得到了完全相反的文档。>chrome.tabs.getCurrent >获取正在调用此脚本的选项卡。如果从非选项卡上下文(例如:背景页面或弹出视图)调用,则可能未定义。请检查:developer.chrome.com/extensions/tabs#method-getCurrent
2021-04-06 23:01:57
chrome.tabs 对我来说总是 undef
2021-04-09 23:01:57

内容脚本只能有限地访问 Chrome API。此访问不包括您尝试使用的 API(例如chrome.tabs)。如果您需要使用该 API,则必须在后台脚本1 中这样做

如 Chrome 的内容脚本文档中所列,内容脚本可用的 API 是 [我已将弃用的方法放在删除线 格式]:

列出的几个 API 已被弃用,并且已经使用了一段时间。那些已弃用的已移至不同的位置(也在上面列出):

虽然没有正式弃用,但extension.lastError也可以作为runtime.lastError. 此时,通常在该位置引用:

将您的扩展程序划分为后台脚本和内容脚本

您将需要根据每种类型的脚本可用的功能将代码分为需要在后台脚本中的内容和需要在内容脚本中的内容。内容脚本可以访问它们被注入的网页的 DOM,但对扩展 API 的访问权限有限。后台脚本可以完全访问扩展 API,但不能访问网页内容。您应该阅读Chrome 扩展概述以及从那里链接的页面,以了解应该在哪种类型的脚本中定位哪些功能。

需要在内容脚本和后台脚本之间进行通信是很常见的。为此,您可以使用消息传递这允许您在两个脚本之间传递信息,以完成仅使用一种脚本无法完成的任务。例如,在您的内容脚本中,您可能需要只能从其他 Chrome API 之一获得的信息,或者您需要发生一些最适合(或只能)通过其他 Chrome 扩展 API 之一完成的事情。在这些情况下,您需要向后台脚本发送一条消息,使用chrome.runtime.sendMessage(),告诉它需要做什么,同时提供足够的信息使其能够这样做。然后,您的后台脚本可以将所需的信息(如果有)返回到您的内容脚本。或者,有时处理将主要在后台脚本中完成。后台脚本可能会注入一个内容脚本,或者只是给一个已经注入的脚本发消息,以从页面获取信息,或者对网页进行更改。


  1. 后台脚本是指在后台上下文中的任何脚本。除了实际background脚本之外,这还包括弹出窗口和选项页面等。但是,您可以确保始终可用于从内容脚本接收消息的唯一页面是您manifest.json 中定义的实际background脚本由于用户与浏览器的交互,其他页面有时可能可用,但它们并非始终可用。

这个答案是从一个重复的问题中移出来的,然后被修改了。

getCurrent chrome.tabs.getCurrent(function callback)获取调用此脚本的选项卡。如果从非选项卡上下文(例如,背景页面或弹出视图)调用,则可能未定义。 developer.chrome.com/extensions/tabs#method-getCurrent
2021-03-26 23:01:57
@GregDomjanchrome.tabs仅在后台上下文中可用。内容脚本不在后台上下文中并且不可chrome.tabs用。可以在选项卡内打开扩展程序中的 HTML 页面。最常见的是选项页面,但您也可以有其他页面。这些将在后台上下文中,并有一个与之关联的选项卡,可以从chrome.tabs.getCurrent().
2021-03-30 23:01:57

https://developer.chrome.com/extensions/tabs#method-getSelected显示

被选中

chrome.tabs.getSelected(integer windowId, function callback)
自 Chrome 33 起已弃用。请使用 tabs.query {active: true}。
获取在指定窗口中选择的选项卡。

也许,你应该像这样popup.js 中使用 chrome.tabs.query

chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
    console.log(tabs[0].url);
});

,重新加载您的扩展并在您的扩展的检查元素中检查结果。

结果图像

代码图像

https://developer.chrome.com/extensions/tabs#type-Tab显示 选项卡显示的 URL。此属性仅在扩展程序的清单包含“tabs”权限时才存在。(只是为了提醒有人忘记了。我刚测试的时候就忘记了。)

不,问题在于注入的内容脚本完全无法使用选项卡 API
2021-03-10 23:01:57

也检查这个答案https://stackoverflow.com/a/6718277/449345 这个对我有用

chrome.tabs.getSelected(null, function(tab){
    console.log(tab);
});
自 Chrome 33 起不推荐使用 getSelected() chrome.tabs 方法
2021-03-27 23:01:57