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

kt06eoxx  于 2023-03-21  发布在  Go
关注(0)|答案(4)|浏览(246)

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

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

但在myScript.js中,以下代码返回undefined。

chrome.tabs
7ivaypg9

7ivaypg91#

Content script只能使用chrome.i18n、chrome.dom、chrome.storage以及chrome.runtime/chrome.extension的子集。
大多数chrome API(如chrome.tabs)仅在chrome-extension://脚本中可用,如后台脚本(MV 3中的服务工人)、弹出脚本等。

溶液

Pass a message从内容脚本迁移到background script,并在那里使用API。

7vux5j2d

7vux5j2d2#

Content scripts对Chrome API只有有限的访问权限。此访问权限不包括您尝试使用的API(例如chrome.tabs)。如果您需要使用该API,则必须在background script 1.
如Chrome的content scripts documentation中所列,内容脚本可用的API有[我已将弃用的方法以删除线格式显示]:

  • extension(获取URL,匿名匿名上下文,最后错误,请求时,发送请求)
  • i18n
  • runtime(连接、获取清单、获取URL、ID、连接、消息、发送消息)
  • storage

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

  • extension.onRequestruntime.onMessage
  • 一米三米一

虽然extension.lastError尚未正式弃用,但它也可以runtime.lastError的形式提供。此时,它通常在以下位置引用:

  • 一米七纳一

将扩展模块划分为后台脚本和内容脚本

您需要根据每种脚本类型的可用功能,将代码分为需要在后台脚本中使用的代码和需要在内容脚本中使用的代码。内容脚本可以访问它们要注入的网页的DOM,但对扩展API的访问权限有限。后台脚本可以完全访问扩展API,但是不能访问网页内容。您应该阅读Chrome extension overview,以及从那里链接的页面,以了解什么功能应该位于哪种类型的脚本中。
通常需要在内容脚本和后台脚本之间进行通信。为此,您可以使用message passing。这允许您在两个脚本之间进行信息通信,以完成仅使用一种脚本无法完成的任务。例如,在内容脚本中,您可能需要只能从其他Chrome API之一获得的信息。或者你需要一些事情发生(或仅)通过其他Chrome扩展API之一完成。在这些情况下,您将需要使用chrome.runtime.sendMessage()send a message添加到您的后台脚本中,以告诉它需要做什么,同时提供足够的信息使其能够执行此操作。然后,后台脚本可以将所需的信息(如果有)返回到内容脚本。或者,有时候处理主要是在后台脚本中完成的。2后台脚本可能会注入一个内容脚本,或者只是发送消息给一个已经注入的脚本,以从一个页面获取信息,或者对网页进行改变。
1.后台脚本是指在后台环境中的任何脚本。除了实际的background scripts之外,这还包括弹出窗口和选项页面等。但是,您可以确保始终可用于接收来自内容脚本的消息的唯一页面是 * manifest.json * 中定义的实际background scripts。其他页面可能在某些时候由于用户的s与浏览器的交互,但它们并非始终可用。
此答案是从duplicate question中移来的,然后进行了修改。

alen0pnh

alen0pnh3#

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

获取选定项

getSelected(整型窗口ID,函数回调)

自Chrome 33起已弃用。请使用制表符。query {active:真}。

获取在指定窗口中选定的选项卡。
也许,你应该像这样在***popup.js***中使用chrome.tabs.query

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

reload您的扩展并检查扩展的inspect元素中的结果。

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

vsmadaxz

vsmadaxz4#

也请检查此答案https://stackoverflow.com/a/6718277/449345此答案对我有效

chrome.tabs.getSelected(null, function(tab){
    console.log(tab);
});

相关问题