Google chrome extension chrome扩展-从后台页面获取选项卡url,无需弹出窗口

Google chrome extension chrome扩展-从后台页面获取选项卡url,无需弹出窗口,google-chrome-extension,Google Chrome Extension,我想能够得到用户当前的标签url,而不必强迫用户点击弹出按钮。我已经得到了一个脚本来计算用户点击弹出图标的位置,一切都按照它应该的方式进行,但是为了尝试实现我当前的目标(不用按按钮),我复制了代码并将其粘贴到背景页面中,但没有得到任何结果。我的猜测是,我需要一些积极的倾听者或类似的东西 这是我使用弹出按钮使用的javascript <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.min.js"&

我想能够得到用户当前的标签url,而不必强迫用户点击弹出按钮。我已经得到了一个脚本来计算用户点击弹出图标的位置,一切都按照它应该的方式进行,但是为了尝试实现我当前的目标(不用按按钮),我复制了代码并将其粘贴到背景页面中,但没有得到任何结果。我的猜测是,我需要一些积极的倾听者或类似的东西

这是我使用弹出按钮使用的javascript

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.min.js"></script>
<script>
window.addEventListener("load", windowLoaded, false);
function windowLoaded() {
  chrome.tabs.getSelected(null, function(tab) {
        //doing stuff with the url
  });
}
</script>

addEventListener(“加载”,windowLoaded,false);
函数windowLoaded(){
chrome.tabs.getSelected(空,函数(选项卡){
//使用url做一些事情
});
}

在您的Chrome扩展中,您可能需要一个在后台运行的文件。在创建名为
background.js的页面时


这将允许您在文件中放置代码,该代码在启用扩展名时保持不变。

根据打包应用程序的文档(对于扩展名可能相同,也可能不同),您可以使用chrome.app API中的onLaunched事件在应用程序启动时运行代码:

// start doing something when the app first loads....
chrome.app.runtime.onLaunched.addListener(function() {
    // all your monitoring code will go here

});
请注意,如果正在构建扩展,并且您的扩展应该在浏览器加载后立即开始侦听,则可能不需要声明“onLaunched”侦听器

此外,如果您希望始终知道用户在当前活动选项卡中的url,则需要监视活动选项卡的更改。包含许多有助于您使用扩展中的选项卡的信息,例如,下面是监视活动选项卡更改的代码:

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
    console.info("This is the url of the tab = " + changeInfo.url);
    // do stuff with that url here....
});
如果用户更改活动选项卡中的url,此处理程序将监视该更改:

chrome.tabs.onActivated.addListener(function(activeInfo) { .. }
但是,onActivated的文档说明如下:

当窗口中的活动选项卡更改时激发。请注意,在触发此事件时可能未设置选项卡的URL,但您可以在设置URL时侦听要通知的未更新事件

因此,您很可能只使用onUpdated事件示例

当您在后台页面中遇到希望将JavaScript注入的页面时。例如,要使用JavaScript更改页面的背景色,请使用以下代码:

chrome.tabs.executeScript(null,
                           {code:"document.body.bgColor='red'"});
请记住,您的背景页面不能直接运行JavaScript或操纵网页的DOM;因此,您需要以这种方式注入代码,这将包括注入jQuery和其他您需要的资源

不要忘记在manifest.json中允许选项卡权限和后台页面:

/* in manifest.json */
"permissions": [
  "tabs", "http://*/*"
],
"background": {
  "scripts": ["background.js"]
},
要将jQuery注入页面,基本上需要编写构建脚本元素的代码,然后将其注入页面:

chrome.tabs.executeScript(null,
    {code:
        "var script = document.createElement('script');" +
        "script.setAttribute('src', '//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js');" +
        "script.setAttribute('type','text/javascript');" +
        "document.getElementsByTagName('head')[0].appendChild(script);"

   }
);
双引号中的代码不会在后台页面中运行。相反,它在注入到选项卡中的页面时运行。我对双引号中的内容使用单引号,这样解析器就不会混淆并抛出字符串文字错误

请注意,可能有更好、更干净的方法将此类代码注入页面,但对于较小的注入,这就足够了

请记住,如果页面中已经注入jQuery,您可能会遇到冲突。

另一种方法: 从内容脚本获取并发送到后台页面:

url = window.location.href;

    chrome.runtime.sendMessage({greeting: url}, function(response) {
    });
在background.js中

chrome.runtime.onMessage.addListener(function(message,sender,sendResponse){
        var url=message.greeting;
}

您好,在问题中,用户声称已经在使用背景页面。此外,如果链接包含此问题的答案,您应该将其张贴在您的答案中,以避免链接腐烂。祝您好运!:)如果我有一个
background.js
页面,我如何使用jquery,如何修改
window.addEventListener(“load”,windowLoaded,false)啊,谢谢jmort253,我错过了那篇文章,只把写的代码当作点击图标时的代码。我喜欢你的答案,也感谢你提供了粘贴另一链接答案的提示。干杯我可以看看如何让jquery工作的具体例子吗?我使用的是谷歌托管的jquery文件,请查看我在最后包含的示例。
chromehiden.handleResponse
这也是同一个错误。您能够插入其他代码吗?从一些简单的事情开始,比如更改背景示例,以确保这不是权限问题。另外,请确保已将tabs权限添加到清单文件并重新加载扩展名。是的,我尝试了背景颜色更改。这是我的权限数据:
“权限”:[“选项卡”,“http://*/”,“chrome开发工具://*”]}