Question

我应该提前提到我是代码/ stackoverflow的新手，所以如果这个问题没有意义，我很抱歉。我无法忍受，我正在尝试构建一个chrome扩展，用于保存ip地址，url和服务器指纹。 serverfingerprint是一个存在于响应头中的字段。使用我的background.js和localStorage我可以保存这些信息，然后在弹出窗口中显示它。这一切都很好，花花公子除了我无法弄清楚如何在每个标签上保存它，也就是...如果我有5个标签打开，我想点击我的扩展名并让它显示每个相应的标签。示例：单击tab4并显示tab4的url，然后单击tab2并显示tab2的URL。

下面的代码有效，除了它没有绑定到tabId所以它并不完全理想。任何开始研究的想法都会非常感激！

到目前为止我做了什么： background.js：

chrome.experimental.webRequest.onCompleted.addListener(function (details)
{
    var headers = details.responseHeaders;
    localStorage['ip'] = details.ip;
    localStorage['url'] = details.url;

    for (var i = 0, length = headers.length; i < length; i++) 
    {
        var header = headers[i];
        if (header.name == 'X-Server-Fingerprint') 
        {
            localStorage['XServerFingerprint'] = header.value.toString();
            break;
        }
    }
 },{'urls': ['http://www.someurl.com/*']},['responseHeaders']);

popup.js：

document.getElementById('url').innerText = localStorage['url'];
document.getElementById('ip').innerText = localStorage['ip'];
document.getElementById('XServerFingerPrint').innerText = localStorage['XServerFingerPrint'];

Answer 1

由于每个标签都有唯一的ID（直到浏览器重启），您可以使用它来标识标签。

您可能只对当前选项卡感兴趣，这使得事情更简单，因为您不需要localStorage（在浏览器重新启动之间保持数据）。只需使用后台页面的命名空间来存储有关所有选项卡的数据：

//background
var tabs = {}; //all tab data 
chrome.experimental.webRequest.onCompleted.addListener(function (details)
{
    var tabInfo = {};
    tabInfo["ip"] = ...;
    tabInfo["url"] = ...;
    tabInfo["XServerFingerprint"] = ...;

    tabs[details.tabId] = tabInfo;
}

//popup
chrome.tabs.getSelected(null, function(tab){ 
    var tabInfo = chrome.extension.getBackgroundPage().tabs[tab.id]; //get from bg page

    document.getElementById('url').innerText = tabInfo['url'];
    document.getElementById('ip').innerText = tabInfo['ip'];
    document.getElementById('XServerFingerPrint').innerText = tabInfo['XServerFingerPrint'];
});

如果确实需要localStorage，那么可以将tabs对象转换为json字符串并将其存储在那里。

Answer 2

好的，所以我已经解决了我的问题！那些有关镀铬扩展的问题哈哈，看起来几乎就像塞尔格所说的那样（谢谢塞尔格!!）我把它写得有些不同了。

background.htm

chrome.experimental.webRequest.onCompleted.addListener(function (details)
{
    var headers = details.responseHeaders;
    var tabId = details.tabId;
    var ip  = details.ip;
    var url = details.url;

    for (var i = 0, length = headers.length; i < length; i++) {
        var header = headers[i];
           //custom field in response headers from my site
        if (header.name == 'X-Server-Fingerprint') {
            var XServerFingerprint = header.value.toString();
            var data = {
                ip: ip,
                url: url,
                fingerprint: XServerFingerprint
            }
            //store it
            localStorage[tabId] = JSON.stringify(data);
            break;
        }
    }
},{'urls': ['http://www.corbisimages.com/*']},['responseHeaders']);
}

and then on my popup.js

chrome.tabs.getSelected(null, function(tab) {

    var parseData = JSON.parse(localStorage[tab.id]);
    document.getElementById('XServerFingerprint').innerText = parseData.fingerprint;
    document.getElementById('url').innerText = parseData.url;
    document.getElementById('ip').innerText = parseData.ip;
});

Chrome扩展程序，使用localStorage来保存每个标签的ip，tabid，serverfingerprint

2 个答案: