Chrome扩展，将数据从内容传递到背景 [英] chrome extension, pass data from content to background

问题描述

我创建了一个由manifest.json，content.js和background.js组成的扩展。在content.js中，我提取当前标签的URL并在background.js中打开一个新标签。我想要做的，不起作用的是从内容传递URL并将其附加到我在后台调用的URL。

content.js：

  chrome.extension.onMessage.addListener （function（request，sender，sendResponse）
 {
 if（request.greeting ==gimmieyodatas）
 {
 var output =URL =; 
 //检查URL中任何参数的字符'？'
 var paramIndex = document.URL.indexOf（？）; 
 //如果找到，则消除URL中的参数
 if（paramIndex> -1）
 {
 output + = document.URL.substring（0，paramIndex）; 
}; 
 sendResponse（{data：output} ）; 
} 
 else {
 sendResponse（{}）; 
} 
}）; 
  

background.js：

  var output2; 
 chrome.tabs.getSelected（null，function（tab）{
 chrome.tabs.sendMessage（tab.id，{greeting：gimmieyodatas}，function（response）{
 output2 = response.data; 
}）; 
}）; 
 chrome.browserAction.onClicked.addListener（function（）{
 chrome.tabs.create（{url：http://www.google.com？+ output2}，function（tab）{ 
 chrome.tabs.executeScript（tab.id，{file：content.js}，function（）{
 sendMessage（）; 
}）; 
}）; 
}）; 
  

当我从打开的选项卡运行扩展程序时，它会在新选项卡上打开Goog​​le，但它不会不会将当前标签的网址附加到Google网址中，这意味着输出数据不会传递给background.js。我做错了什么？

解决方案

问题是您没有告诉后台页面在新标签页发送消息时被打开。对chrome.tabs.getSelected的调用仅在扩展第一次运行时发生 - 每次打开新选项卡时都不会发生。

通过使用背景页面作为两个内容页面之间的中介，您处于正确的轨道，但我建议采用不同的方法：

每次通过清单文件打开新选项卡时加载内容脚本：

  content_scripts：[
 {
matches：[
< all_urls> 
]，
js：[
content.js

} 
]，
  

使用一个更简单的内容脚本，它会在加载后立即使用当前URL页面向后台发送消息：

（content.js）

  var paramIndex = document.URL.indexOf（'？' ）; 
 if（paramIndex> -1）{
 chrome.runtime.sendMessage（{output2：'URL ='+ document.URL.substring（0，paramIndex）}）; 
} 
  

当后台页面收到消息时，会将URL保存到全局变量中：
$ b （background.js）

  var output2; 
 chrome.extension.onMessage.addListener（function（request，sender，sendResponse）{
 output2 = request.output2; 
}）; 
  

然后，您可以在点击操作按钮时加载该网址：

（background.js）

  chrome.browserAction.onClicked.addListener（function（）{
 chrome.tabs.create（{url：http://www.google.com？+ output2}）; 
}）; 
  

I've created a chrome extension that consists of manifest.json, content.js and background.js. in content.js, I'm extracting the current tab's URL and in background.js, I'm opening a new tab. what I want to do, which doesn't work is to pass the URL from content and append it to the URL that I'm calling in background.

content.js:

chrome.extension.onMessage.addListener(function(request, sender, sendResponse)
{
    if(request.greeting=="gimmieyodatas")
    {
    var output ="URL=";
    //check for the character '?' for any parameters in the URL
    var paramIndex = document.URL.indexOf("?");
    //if found, eliminate the parameters in the URL
    if (paramIndex > -1)
    {
        output += document.URL.substring(0, paramIndex);
    };
        sendResponse({data: output});
    }
    else{
        sendResponse({}); 
    }
});

background.js:

var output2;
chrome.tabs.getSelected(null, function(tab) {
  chrome.tabs.sendMessage(tab.id, {greeting:"gimmieyodatas"}, function(response) {
    output2 = response.data;
  });
});
chrome.browserAction.onClicked.addListener(function() {
    chrome.tabs.create({url: "http://www.google.com?" + output2}, function(tab) {
        chrome.tabs.executeScript(tab.id, {file: "content.js"}, function() {
            sendMessage();
        });
    });
});

When I run the extension from an open tab, it opens google on a new tab, but it doesn't append the current tab's URL in google URL, meaning the 'output' data does not get passed to the background.js. What am I doing wrong?

解决方案

The problem is that you are not telling the background page to send a message when a new tab is opened. The call to chrome.tabs.getSelected only happens once when the extension is first run -- it does not happen every time a new tab is opened.

You're on the right track by using the background page as an intermediary between the two content pages, but I suggest a different approach:

Load the content script every time a new tab is opened, via the manifest file:

"content_scripts": [
    {
        "matches" : [
            "<all_urls>"
        ],
        "js" : [
            "content.js"
        ]
    }
],

Use a much simpler content script that just sends a message to the background with the current URL page as soon as it loads:

(content.js)

var paramIndex = document.URL.indexOf('?');
if (paramIndex > -1) {
    chrome.runtime.sendMessage({output2: 'URL=' + document.URL.substring(0, paramIndex)});
}

When the background page receives the message it saves the URL to a global variable:

(background.js)

var output2;
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
    output2 = request.output2;
});

You can then load that URL when the action button is clicked:

(background.js)

chrome.browserAction.onClicked.addListener(function() {
    chrome.tabs.create({url: "http://www.google.com?" + output2});
});

这篇关于Chrome扩展，将数据从内容传递到背景的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！