Google chrome extension 消息不是'；t在background.html和popup.html之间传递

我正在尝试将保存在sessionStorage中的数据从background.html传递到popup.html

background.html：

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
  data = sessionStorage.getItem(request.tabId);
  alert(data);
  sendResponse({ data: data });
});

var data = {}; // Object storing data indexed by tab id

在popup.html中：

chrome.tabs.getSelected(null, function(tab) {
  chrome.extension.sendRequest({ tabId: tab.id }, function(response) { 
    alert(response.data);
  });
});

chrome.tabs.getSelected(null, function(tab) {
  alert(chrome.extension.getBackgroundPage().data[tab.id]);
});

弹出窗口由pageAction按钮打开，当我单击按钮时，弹出窗口上会出现一个带有“null”的警告框，然后是一个带有我存储在后台sessionStorage中的数据的警告框

---

有没有办法解决这个问题？

您不需要使用消息/请求API。我想这可能对你有帮助

您也不需要会话存储，只需将数据存储在后台页面的全局变量中即可。它将一直存在，直到浏览器关闭或扩展重新启动

下面是我将如何重写您的代码：

background.html：

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
  data = sessionStorage.getItem(request.tabId);
  alert(data);
  sendResponse({ data: data });
});

var data = {}; // Object storing data indexed by tab id

在popup.html中：

chrome.tabs.getSelected(null, function(tab) {
  chrome.extension.sendRequest({ tabId: tab.id }, function(response) { 
    alert(response.data);
  });
});

chrome.tabs.getSelected(null, function(tab) {
  alert(chrome.extension.getBackgroundPage().data[tab.id]);
});

请注意，

chrome.tabs.getSelected

已被弃用，因此弹出代码应为：

chrome.windows.getCurrent(function(win) { 
  chrome.tabs.query({'windowId': win.id, 'active': true}, function(tabArray) {
    alert(chrome.extension.getBackgroundPage().data[tabArray[0].id]);
  }); 
});

---

您不需要使用消息/请求API。我想这可能对你有帮助

您也不需要会话存储，只需将数据存储在后台页面的全局变量中即可。它将一直存在，直到浏览器关闭或扩展重新启动

下面是我将如何重写您的代码：

background.html：

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
  data = sessionStorage.getItem(request.tabId);
  alert(data);
  sendResponse({ data: data });
});

var data = {}; // Object storing data indexed by tab id

在popup.html中：

chrome.tabs.getSelected(null, function(tab) {
  chrome.extension.sendRequest({ tabId: tab.id }, function(response) { 
    alert(response.data);
  });
});

chrome.tabs.getSelected(null, function(tab) {
  alert(chrome.extension.getBackgroundPage().data[tab.id]);
});

请注意，

chrome.tabs.getSelected

已被弃用，因此弹出代码应为：

chrome.windows.getCurrent(function(win) { 
  chrome.tabs.query({'windowId': win.id, 'active': true}, function(tabArray) {
    alert(chrome.extension.getBackgroundPage().data[tabArray[0].id]);
  }); 
});

---

我做了些蠢事

---

我在一个选项卡中打开

chrome扩展名：//[extension id]/background.html

，而不是在扩展名管理页面中单击“检查活动视图：

background.html

”，从而检查了后台页面。这导致选项卡捕获请求并调用

sendResponse

，但弹出窗口期望真实的后台页面调用

sendResponse

（如果我了解Google关于消息传递的文档，sendResponse被调用了两次是问题的根源，因为第一次调用清除了

请求

对象）

好吧，我做了一些愚蠢的事情

---

我通过在选项卡中打开

chrome扩展名：//[extension id]/background.html

而不是单击“检查活动视图：

background.html

”来检查背景页面在扩展管理页面中。这导致选项卡捕获请求并调用

sendResponse

，但弹出窗口预期真实的后台页面调用

sendResponse

（如果我了解Google关于消息传递的文档，sendResponse被调用两次是问题的根源，因为第一次调用清除了

请求

对象）

您是否考虑过使用

localStorage

？这样您就可以直接在弹出窗口中访问数据，而无需传递消息。我希望数据在会话结束后立即消失，localStorage是否持久？

localStorage

是持久的。您可以在下次打开后台页面时清除它。您考虑过吗使用

localStorage

？然后您可以直接在弹出窗口中访问数据，而无需传递消息。我希望数据在会话结束后立即消失，localStorage不是持久的吗？

localStorage

是持久的。您可以在下次打开后台页面时清除它。谢谢您的建议，请参阅我的我自己对问题原因的答案是——我尝试使用全局对象以及

sessionStorage

和

localStorage

都没有用。我仍然更喜欢

sessionStorage

而不是全局对象，因为我存储了几MB的数据，这看起来似乎是“正确的”，尽管我公开反对意见：）非常感谢您告诉我关于

getSelected（）

！不客气。顺便说一句，

sessionStorage

对象对于后台页面和弹出页面不是同一个对象吗（因为它们共享同一个“域”）？仅供参考，本地存储（我猜是sessionStorage）不是专门用来存储大型对象的。事实上，如果你看性能的话，这是完全正确的。我原以为

sessionStorage

的行为与

localStorage

的行为相同，但它对我不起作用。这个测试用例说服我改为使用一个简单的对象：）谢谢你的建议，查看我自己对问题原因的回答-我尝试使用全局对象以及

sessionStorage

和

localStorage

，但均无效。与全局对象相比，我仍然更喜欢

sessionStorage

，因为我存储了几兆字节的数据，而且它似乎“正确”，尽管我公开反对：）非常感谢您告诉我有关

getSelected（）

的反对意见！不客气。顺便说一句，

sessionStorage

对象不是后台页面和弹出页面的同一个对象吗（因为它们共享同一个“域”）？仅供参考，localStorage（我猜sessionStorage）并不是专门用来存储大对象的。事实上，如果你看一下性能的话，你会发现这一点。我原以为

sessionStorage

的行为与

localStorage

的行为相同，但它对我不起作用。这个测试用例说服我使用一个简单的对象：）