Mam stronę opcji, na której użytkownik może definiować pewne opcje i zapisuje ją w localStorage: options.html

Teraz mam także skrypt zawartości, który musi pobrać opcje zdefiniowane na options.htmlstronie, ale kiedy próbuję uzyskać dostęp do localStorage ze skryptu zawartości, nie zwraca wartości ze strony opcji.

Jak sprawić, by mój skrypt zawartości pobierał wartości z localStorage, ze strony opcji, a nawet strony w tle?

Aktualizacja 2016:

Google Chrome udostępnił interfejs API do przechowywania danych: http://developer.chrome.com/extensions/storage.html

Jest dość łatwy w użyciu, podobnie jak inne interfejsy API Chrome i możesz go używać z dowolnego kontekstu strony w Chrome.

    // Save it using the Chrome extension storage API.
    chrome.storage.sync.set({'foo': 'hello', 'bar': 'hi'}, function() {
      console.log('Settings saved');
    });

    // Read it using the storage API
    chrome.storage.sync.get(['foo', 'bar'], function(items) {
      message('Settings retrieved', items);
    });

Aby z niego skorzystać, upewnij się, że zdefiniowałeś go w manifeście:

    "permissions": [
      "storage"
    ],

Istnieją metody „usuwania”, „czyszczenia”, „getBytesInUse” i nasłuchiwania zdarzeń do nasłuchiwania zmienionej pamięci „onChanged”

Korzystanie z natywnego localStorage ( stara odpowiedź z 2011 r. )

Skrypty zawartości działają w kontekście stron internetowych, a nie stron rozszerzeń. Dlatego jeśli uzyskujesz dostęp do localStorage ze swojego skryptu contentcript, będzie to pamięć z tej strony internetowej, a nie pamięć strony rozszerzenia.

Teraz, aby pozwolić skryptowi zawartości na odczytanie pamięci rozszerzeń (gdzie ustawiasz je na stronie opcji), musisz użyć przekazywania wiadomości rozszerzenia .

Pierwszą rzeczą, którą musisz zrobić, jest poinformowanie skryptu zawartości, aby wysłał żądanie do twojego rozszerzenia w celu pobrania niektórych danych, a te dane mogą być twoim rozszerzeniem localStorage:

contentcript.js

chrome.runtime.sendMessage({method: "getStatus"}, function(response) {
  console.log(response.status);
});

background.js

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    if (request.method == "getStatus")
      sendResponse({status: localStorage['status']});
    else
      sendResponse({}); // snub them.
});

Możesz zastosować interfejs API, aby uzyskać ogólne dane localStorage do skryptu zawartości lub być może pobrać całą tablicę localStorage.

Mam nadzieję, że pomogło to rozwiązać Twój problem.

Aby być fantazyjnym i ogólnym ...

contentcript.js

chrome.runtime.sendMessage({method: "getLocalStorage", key: "status"}, function(response) {
  console.log(response.data);
});

background.js

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    if (request.method == "getLocalStorage")
      sendResponse({data: localStorage[request.key]});
    else
      sendResponse({}); // snub them.
});

Czasami lepiej jest użyć interfejsu API chrome.storage . Lepiej niż localStorage, ponieważ możesz:

• przechowywać informacje z twojego skryptu treści bez potrzeby przekazywania wiadomości między skryptem treści a rozszerzeniem;
• przechowuj dane jako obiekty JavaScript bez serializacji ich do formatu JSON ( localStorage przechowuje tylko ciągi ).

Oto prosty kod demonstrujący użycie chrome.storage. Skrypt treści pobiera adres URL odwiedzanej strony i sygnaturę czasową i przechowuje je, a popup.js pobiera z magazynu.

content_script.js

(function () {
    var visited = window.location.href;
    var time = +new Date();
    chrome.storage.sync.set({'visitedPages':{pageUrl:visited,time:time}}, function () {
        console.log("Just visited",visited)
    });
})();

popup.js

(function () {
    chrome.storage.onChanged.addListener(function (changes,areaName) {
        console.log("New item in storage",changes.visitedPages.newValue);
    })
})();

„Zmiany” to obiekt zawierający starą i nową wartość dla danego klucza. Argument „AreaName” odnosi się do nazwy obszaru pamięci, „lokalny”, „synchronizacja” lub „zarządzany”.

Pamiętaj, aby zadeklarować zezwolenie na przechowywanie w pliku manifest.json.

manifest.json

...
"permissions": [
    "storage"
 ],
...

Inną opcją byłoby użycie interfejsu API chromestorage. Pozwala to na przechowywanie danych użytkownika z opcjonalną synchronizacją między sesjami.

Jedną wadą jest to, że jest asynchroniczny.

https://developer.chrome.com/extensions/storage.html