Tengo una página de opciones donde el usuario puede definir ciertas opciones y la guarda en localStorage: options.html

Ahora, también tengo un script de contenido que necesita obtener las opciones que se definieron en la options.htmlpágina, pero cuando trato de acceder a localStorage desde el script de contenido, no devuelve el valor de la página de opciones.

¿Cómo hago que mi script de contenido obtenga valores de localStorage, de la página de opciones o incluso de la página de fondo?

Actualización 2016:

Google Chrome lanzó la API de almacenamiento: http://developer.chrome.com/extensions/storage.html

Es bastante fácil de usar como las otras API de Chrome y puede usarlo desde cualquier contexto de página dentro de 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);
    });

Para usarlo, asegúrese de definirlo en el manifiesto:

    "permissions": [
      "storage"
    ],

Hay métodos para "eliminar", "borrar", "getBytesInUse" y un detector de eventos para escuchar el almacenamiento modificado "onChanged"

Uso de localStorage nativo ( antigua respuesta de 2011 )

Los scripts de contenido se ejecutan en el contexto de páginas web, no páginas de extensión. Por lo tanto, si está accediendo a localStorage desde su script de contenido, será el almacenamiento de esa página web, no el almacenamiento de la página de extensión.

Ahora, para permitir que su secuencia de comandos de contenido lea el almacenamiento de su extensión (donde los configura desde su página de opciones), debe usar la transmisión de mensajes de extensión .

Lo primero que debe hacer es indicarle a su script de contenido que envíe una solicitud a su extensión para obtener algunos datos, y esos datos pueden ser su extensión localStorage:

contentscript.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.
});

Puede hacer una API para obtener datos genéricos de localStorage en su secuencia de comandos de contenido, o tal vez, obtener toda la matriz localStorage.

Espero que eso haya ayudado a resolver tu problema.

Ser elegante y genérico ...

contentscript.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.
});

A veces puede ser mejor usar la API chrome.storage . Es mejor que localStorage porque puedes:

• almacenar información de su secuencia de comandos de contenido sin la necesidad de que el mensaje pase entre la secuencia de comandos de contenido y la extensión;
• almacenar sus datos como objetos JavaScript sin serializarlos a JSON ( localStorage solo almacena cadenas ).

Aquí hay un código simple que demuestra el uso de chrome.storage. El script de contenido obtiene la url de la página visitada y la marca de tiempo y la almacena, popup.js la obtiene del área de almacenamiento.

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);
    })
})();

"Cambios" aquí es un objeto que contiene valores antiguos y nuevos para una clave determinada. El argumento "AreaName" se refiere al nombre del área de almacenamiento, 'local', 'sincronización' o 'administrado'.

Recuerde declarar el permiso de almacenamiento en manifest.json.

manifest.json

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

Otra opción sería utilizar la API de chromestorage. Esto permite el almacenamiento de datos del usuario con sincronización opcional entre sesiones.

Un inconveniente es que es asíncrono.

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