如何在扩展后台页面访问localStorage？ [英] How to access localStorage in extension background page?

问题描述

我有一个Chrome扩展，它在内容脚本的JavaScript localStorage中设置一个字符串值。我已经通过抓取并显示它进行了测试。在加载后的同一页面上，我仍然可以访问JavaScript控制台中存储的字符串。如果我转到任何其他选项卡的js控制台，或者当我尝试在我的其他扩展后台页面中访问它时（浏览器操作被点击后）它将返回null。

extension 1 contentscript.js

  embeded.addEventListener 
（
message，
函数（消息）
 {
 localStorage.setItem（pdf，message.data）; 
 loadPDF（message.data）; 
}，
 false 
）; 
  

扩展名2 background.js

  chrome.browserAction.onClicked.addListener（function（tab）{
 if（tab.url.substr（tab.url.length  -  4）===.pdf）
 {
 if（localStorage.getItem（pdf）！== null）
 {
 alert（boomy）; 
} 
} 
}）; 
  

解决方案

localStorage 在扩展页面（背景，选项，弹出窗口）之间共享，但不是内容脚本。 大多数情况下不会在两个扩展名之间共享！

您有两个半选项。 2个独立的扩展，只有一个选项。

---

选项一：依靠消息传递

当您需要在后台和内容脚本之间传递一些值时，您可以通过消息传递来完成此操作。

contentscript.js：

$ b适用于特殊情况。 $ b

  embeded.addEventListener（
message，
 function（message）
 {
 chrome.runtime.sendMessage（extensionTwoId ，{pdf：message.data}）; 
 loadPDF（message.data）; 
}，
 false 
）; 
  

background.js：

  chrome.runtime.onMessageExternal.addListener（
函数（message，sender，sendResponse）{
 if（sender.id！== extenstionOneId）return ; 
 if（message.pdf）localStorage.setItem（pdf，message.pdf）; 
} 
）; 
 $ b $ / * ... * / 
  

---

选项二： chrome.storage 。 不适用于两个扩展名之间。

I have a chrome extension that sets a string value in JavaScript localStorage in a content script. I have tested that it is being set by grabbing it and displaying it. While on the same page after it has loaded I can still access the stored string in the javascript console. If I go to any other tabs js console or when I try to access it in my other extensions background page(After the browser action has been clicked) it is returning null.

extension 1 contentscript.js

embeded.addEventListener
(
 "message",
 function(message)
 {
  localStorage.setItem("pdf", message.data);
  loadPDF(message.data);
 },
 false
);

extension 2 background.js

chrome.browserAction.onClicked.addListener(function(tab) {
  if (tab.url.substr(tab.url.length - 4) === ".pdf")
  {    
    if (localStorage.getItem("pdf") !== null)
    {
      alert("boomy"); 
    }
  }
});

解决方案

localStorage is shared among extension pages (background, options, popup), but not content scripts. And most certainly not shared between 2 extensions!

You have two-and-a-half options. With 2 separate extensions, only one option.

---

Option one: rely on messaging.

When you need to pass some value between background and content script, you can do so with messaging. Works especially well if you only need to pass it in one direction.

contentscript.js:

embeded.addEventListener(
  "message",
  function(message)
  {
    chrome.runtime.sendMessage(extensionTwoId, {pdf: message.data});
    loadPDF(message.data);
  },
  false
);

background.js:

chrome.runtime.onMessageExternal.addListener(
  function(message, sender, sendResponse) {
    if(sender.id !== extenstionOneId) return;
    if(message.pdf) localStorage.setItem("pdf", message.pdf);
  }
);

/* ... */

---

Option two: chrome.storage. Not applicable between 2 extensions.

这篇关于如何在扩展后台页面访问localStorage？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！