Chrome扩展，使用localStorage保存ip, tabid, serverfingerprint每个标签

Chrome extension, using localStorage to save ip, tabid, serverfingerprint per tab

本文关键字：serverfingerprint tabid 标签 保存 扩展 使用 localStorage Chrome ip      更新时间：2023-09-26

我应该事先提到我是code/stackoverflow的新手，所以如果这个问题没有意义，我很抱歉。我超越了难住，我试图建立一个chrome扩展，保存ip地址，url和服务器指纹。serverfingerprint是一个位于响应头中的字段。使用我的background.js和localStorage我可以保存这些信息，然后在我的弹出窗口中显示它。这一切都很好，除了我不知道如何保存它在每个标签的基础上，也就是…如果我有5个选项卡打开，我想点击我的扩展，并让它显示每个相应选项卡的url。例如:点击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'];

由于每个选项卡都有唯一的id(直到浏览器重新启动)，您可以使用它来识别选项卡。

您可能只对当前选项卡感兴趣，这使得事情更简单，因为您不需要localStorage(在浏览器重启之间保存数据)。只需使用背景页的命名空间来存储所有选项卡的数据:

// background.js
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.js
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字符串并存储在那里

好了，我的问题已经解决了!好吧，那些关于chrome扩展哈哈，这似乎是几乎完全是什么Serg说(谢谢Serg!!)我写得有点不一样。

// background.js
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;
});
相关文章：
  • 没有找到相关文章