google-chrome-extension - remove - chrome storage quota

Extensión de Chrome: acceder a localStorage en la secuencia de comandos de contenido

Question

Entonces, 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 página options.html , pero cuando intento acceder a localStorage desde el script de contenido, no devuelve el valor de la página de opciones.

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

Answer 1

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 puedes 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"

Usando localStorage local ( antigua respuesta de 2011 )

Los scripts de contenido se ejecutan en el contexto de páginas web, no de páginas de extensión. Por lo tanto, si está accediendo a localStorage desde su contenido, será el almacenamiento desde 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 su almacenamiento de extensión (donde los configuró desde su página de opciones), debe usar el paso de mensajes de extensión.

Lo primero que debe hacer es decirle a su secuencia de comandos 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 almacenamiento local 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.
});

Answer 2

A veces puede ser mejor usar la API de http://developer.chrome.com/extensions/storage.html . Es mejor que localStorage porque puedes:

• almacenar información de su script de contenido sin la necesidad de pasar mensajes entre el script de contenido y la extensión;
• almacene sus datos como objetos JavaScript sin serializarlos en 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" hace referencia al nombre del área de almacenamiento, ya sea ''local'', ''sync'' o ''managed''.

Recuerde declarar el permiso de almacenamiento en manifest.json.

manifest.json

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

Answer 3

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

Un inconveniente es que es asincrónico.

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