Want to access local storage of Chrome extension

Question

My manfiest.json is this.

    {
  "manifest_version": 2,

  "name": "GTmetrix Analyzer Plugin",
  "description": "This extension will analyze a page using GTmetrix",
  "version": "2.1",
  "options_page": "options.html",
  "browser_action": {
   "default_icon": "icon.png",
   "default_popup": "popup.html"
  },
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },
  "permissions": ["tabs", "storage"], 
  "content_scripts": [
      {
          "matches": ["http://ticketchest.geekschicagolabs.com/admin/orderHistory"],
          "css": ["mystyles.css"],
          "js": ["jqueryui-min.js", "content-script.js"]
      }
  ]
}

and my popup.html is

    <!doctype html>
<html>
  <head>
    <title>Ticket chest</title>
    <script src="popup.js"></script>
  </head>
  <body>
    <h1>Ticket chest extension</h1>
    <a href="options.html">Settings</a>
    <!-- <button id="checkPage">Check this page now!</button> -->
  </body>
</html>

and background.js is

    chrome.runtime.onMessage.addListener(function(response, sender, sendResponse){
 localStorage['privateKeyy'] = response;
});

Now I want what user enter in text area it will be also save in local storage of web with local storage of extenison, it is saved in extenstion local storage but not in web page.

and that's content script code

    window.onload = function() {

  document.getElementById('save').onclick = function(){
   var privateKey = document.getElementById("textarea").value;

   chrome.storage.sync.set({'privateKey':privateKey}, function(){
    //document.getElementById('privateKey').value = privateKey;
    //chrome.browserAction.setBadgeBackgroundColor({color:[200, 0, 0, 100]});
    //chrome.tabs.sendMessage(privateKey);
    chrome.storage.local.set({'privateKeyy':privateKey});
    localStorage.setItem("lastname", "Smith");
    alert('save successfully');
   });
   //syncStorage["privateKey"] = privateKey;
  }

  document.getElementById('erase').onclick = function(){
   chrome.storage.sync.remove('privateKey', function(){
    alert('erase successfully');
   });
  }

  document.getElementById('get').onclick = function(){
   chrome.storage.sync.get('privateKey', function(data){
    alert(data.privateKey);
    console.log(data.privateKey);
   });
  }

}

@Farkie i follow this link but may b i am getting it wrong key is not store in local storage of web page... — hu7sy, Jun 22 '16 at 09:45
because you are using `localStorage['privateKeyy']` instead of `StorageArea.set({privateKey: response});` — Farkie, Jun 22 '16 at 10:17
Error in event handler for runtime.onMessage: ReferenceError: StorageArea is not defined — hu7sy, Jun 22 '16 at 10:24
you can't use the webpage localStorage unless you manually inject the script. question is super unclear. — Zig Mandel, Jun 22 '16 at 12:00
content_script only load first time so how can i save it when user save it by extension? — hu7sy, Jun 22 '16 at 12:12

score 3 · Answer 1 · edited May 23 '17 at 12:08

3

If you like to store data in the web page's local storage move your code to a content script (instead of executing the code (only) in the extension's background script). See also here: https://stackoverflow.com/a/23082216/4419582

edited May 23 '17 at 12:08

Community

1
1

answered Jun 22 '16 at 12:14

jengeb

393
1
7
21

it is still save key in extension local storage – hu7sy Jun 22 '16 at 12:23
Can you provide more code especially your `content-script.js`? I just executed `localStorage.setItem("key", "value");` in my content script and now I can see them stored (by using the developer tools of Chromium) in the local storage of my currently opened web page – and there is no data in the extension's local storage. – jengeb Jun 22 '16 at 12:38
i have updated that was js code, but i moved it into content script as you say... – hu7sy Jun 23 '16 at 06:01
i have add localStorage.setItem("key", "value"); it is added in local storage of web page for first when web page load first time but when i added it in save function than it is not saving in local storage of web page. – hu7sy Jun 23 '16 at 06:08
So local storage works fine when addressed in content script, right? So I guess `chrome.storage.sync.set` doesn't work for you as expected. Maybe the following link could help: http://stackoverflow.com/a/14533446/4419582 – jengeb Jun 24 '16 at 10:22

Want to access local storage of Chrome extension

1 Answers1