javascript Chrome 扩展:尝试获取标签 URL 时 Background.js“Uncaught TypeError”

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/24763691/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 03:19:47  来源:igfitidea点击:

Chrome Extension: Background.js "Uncaught TypeError" when trying to get tab url

javascriptgoogle-chromegoogle-chrome-extension

提问by Aprilsnar

I'm getting following warning/error from my extension when opening debugging tool (all the following code works perfect, but it is throwing this error):

打开调试工具时,我从扩展程序中收到以下警告/错误(以下所有代码都运行良好,但它抛出了此错误):

Uncaught TypeError: Cannot read property 'onUpdated' of undefined

未捕获的类型错误:无法读取未定义的属性“onUpdated”

In my code below I'm trying to get the current tab url for the browser. (This is a background.js script)

在下面的代码中,我试图获取浏览器的当前选项卡 URL。(这是一个 background.js 脚本)

chrome.tabs.onUpdated.addListener(function(tabId,changeInfo,tab) {
    chrome.tabs.getSelected(null,function(tab) {
        var tablink = tab.url;
        console.log("Website: " + tablink);
    });
});

This script above is my background script, called from manifest.

上面的这个脚本是我的后台脚本,从清单中调用。

"background": {
    "scripts": ["background.js"]
},

My question is now, why does it throw an error when the code works? Error is displayed in the chrome "debugging / inspect-element". How can I remove this so called "error" from the debugging?

我现在的问题是,为什么代码运行时会抛出错误?错误显示在chrome“调试/检查元素”中。如何从调试中删除这个所谓的“错误”?

EDITAfter using a "whoami" call from content script to background script i get following error on background script.

编辑在使用从内容脚本到后台脚本的“whoami”调用后,我在后台脚本上出现以下错误。

providing tab information background.js:3 Error in event handler for runtime.onMessage: Cannot read property 'url' of undefined Stack trace: TypeError: Cannot read property 'url' of undefined at chrome-extension://hejlnkjmnpomhknnbfjdfnablcmkloid/background.js:4:41 at Function.target.(anonymous function) (extensions::SafeBuiltins:19:14) at EventImpl.dispatchToListener (extensions::event_bindings:397:22) at Function.target.(anonymous function) (extensions::SafeBuiltins:19:14) at Event.publicClass.(anonymous function) [as dispatchToListener] (extensions::utils:89:26) at EventImpl.dispatch_ (extensions::event_bindings:379:35) at EventImpl.dispatch (extensions::event_bindings:403:17) at Function.target.(anonymous function) (extensions::SafeBuiltins:19:14) at Event.publicClass.(anonymous function) [as dispatch] (extensions::utils:89:26) at messageListener (extensions::messaging:190:29) extensions::uncaught_exception_handler:9

providing tab information background.js:3 Error in event handler for runtime.onMessage: Cannot read property 'url' of undefined Stack trace: TypeError: Cannot read property 'url' of undefined at chrome-extension://hejlnkjmnpomhknnbfjdfnablcmkloid/background.js:4:41 at Function.target.(anonymous function) (extensions::SafeBuiltins:19:14) at EventImpl.dispatchToListener (extensions::event_bindings:397:22) at Function.target.(anonymous function) (extensions::SafeBuiltins:19:14) at Event.publicClass.(anonymous function) [as dispatchToListener] (extensions::utils:89:26) at EventImpl.dispatch_ (extensions::event_bindings:379:35) at EventImpl.dispatch (extensions::event_bindings:403:17) at Function.target.(anonymous function) (extensions::SafeBuiltins:19:14) at Event.publicClass.(anonymous function) [as dispatch] (extensions::utils:89:26) at messageListener (extensions::messaging:190:29) extensions::uncaught_exception_handler:9

采纳答案by Bastien Saro Chassetuillier

I don't directly know why your code doesn't work, but :

我不直接知道为什么您的代码不起作用,但是:

First, getSelected is now deprecated, please refer to the doc https://developer.chrome.com/extensions/tabs#method-getSelectedand use tabs.query {active: true} ;)

首先,现在不推荐使用 getSelected,请参阅文档https://developer.chrome.com/extensions/tabs#method-getSelected并使用 tabs.query {active: true} ;)

Second, here there's a kind of "ambiguity" on which "tab" variable is used when you write "tab.url" is it the one from getSelected, or from Updated event ? (if it's the last, getSelected is useless)

其次,这里有一种“歧义”,当您编写“tab.url”时使用的“tab”变量是来自getSelected还是来自Updated事件?(如果是最后一个,getSelected 就没用了)

回答by Lennart

There's some minor defects in your manifest file. The script files you use in your popup or options page should not be declared as content scripts. Including them into their respective html files is enough (which you are already doing), considering you're not planning to inject them into other external web pages.

您的清单文件中存在一些小缺陷。您在弹出窗口或选项页面中使用的脚本文件不应声明为内容脚本。考虑到您不打算将它们注入到其他外部网页中,将它们包含在各自的 html 文件中就足够了(您已经在这样做了)。

Popup and option pages are not content scripts. They are privileged to use the Chrome APIs just as background scripts are.

弹出和选项页面不是内容脚本。他们有权像后台脚本一样使用 Chrome API。

Content scripts are injected into other web sites. If you are really meaning to do that, you should most likely also include the "run_at" property. Then again, it depends on what you want to do with it.

内容脚本被注入到其他网站。如果您真的打算这样做,您很可能还应该包括“run_at”属性。再说一次,这取决于你想用它做什么。

"content_scripts": [{
        "matches": ["http://*/*","https://*/*"],
        "js": ["jquery.js","chat.js","options.js"],
        "run_at": "document_end"
    }]

However, content scripts don't have the privilege to access the tabs API. Using your background scripts simultaneously as content scripts leads to those type errors and might eventually break your extension, yet it still might seem as though your extension is working - in the scope of the background scripts (popup, options), at least.

但是,内容脚本无权访问选项卡 API。同时使用您的后台脚本作为内容脚本会导致这些类型错误,并可能最终破坏您的扩展程序,但看起来您的扩展程序仍然可以正常工作 - 至少在后台脚本(弹出窗口,选项)的范围内。

Strictly separate background and content scripts. If you don't need to inject code into other web sites, I'd suggest you remove it alongside with the permissions - the permission warning when installing your extension would be unnecessarily demanding if you ask for permission to read and modify user data on all web sites, anyway.

严格分离背景和内容脚本。如果您不需要将代码注入其他网站,我建议您将其与权限一起删除 - 如果您请求读取和修改所有用户数据的权限,安装扩展程序时的权限警告将不必要地要求网站,反正。