Ich habe eine Optionsseite, auf der der Benutzer bestimmte Optionen definieren und in localStorage speichern kann: options.html
Jetzt habe ich auch ein Inhaltsskript, das die auf der options.html
Seite definierten Optionen abrufen muss. Wenn ich jedoch versuche, über das Inhaltsskript auf localStorage zuzugreifen, wird der Wert von der Optionsseite nicht zurückgegeben.
Wie kann ich dafür sorgen, dass mein Inhaltsskript Werte von localStorage, von der Optionsseite oder sogar von der Hintergrundseite erhält?
google-chrome-extension
local-storage
content-script
user476214
quelle
quelle
Antworten:
Update 2016:
Google Chrome hat die Speicher-API veröffentlicht: http://developer.chrome.com/extensions/storage.html
Es ist ziemlich einfach wie die anderen Chrome-APIs zu verwenden und kann von jedem Seitenkontext in Chrome aus verwendet werden.
Um es zu verwenden, stellen Sie sicher, dass Sie es im Manifest definieren:
Es gibt Methoden zum "Entfernen", "Löschen", "getBytesInUse" und einen Ereignis-Listener zum Abhören des geänderten Speichers "onChanged".
Verwenden von nativem localStorage ( alte Antwort von 2011 )
Inhaltsskripte werden im Kontext von Webseiten ausgeführt, nicht von Erweiterungsseiten. Wenn Sie über Ihr Inhaltsskript auf localStorage zugreifen, handelt es sich daher um den Speicher dieser Webseite und nicht um den Speicher der Erweiterungsseite.
Damit Ihr Inhaltsskript Ihren Erweiterungsspeicher lesen kann (wo Sie sie auf Ihrer Optionsseite festgelegt haben), müssen Sie die Weitergabe von Erweiterungsnachrichten verwenden .
Das erste, was Sie tun, ist, Ihr Inhaltsskript anzuweisen, eine Anforderung an Ihre Erweiterung zu senden, um einige Daten abzurufen. Diese Daten können Ihre Erweiterung localStorage sein:
contentcript.js
background.js
Sie können eine API erstellen, um generische localStorage-Daten in Ihr Inhaltsskript abzurufen, oder möglicherweise das gesamte localStorage-Array abrufen.
Ich hoffe, das hat zur Lösung Ihres Problems beigetragen.
Ausgefallen und generisch zu sein ...
contentcript.js
background.js
quelle
sendResponse({data: localStorage});
?localStorage
direkt von der Optionsseite aus anrufen oderchrome.extension.getBackgroundPage
von der Optionsseite aus verwenden.Manchmal ist es möglicherweise besser, die chrome.storage- API zu verwenden. Es ist besser als localStorage, weil Sie:
Hier ist ein einfacher Code, der die Verwendung von chrome.storage demonstriert. Das Inhaltsskript ruft die URL der besuchten Seite und den Zeitstempel ab und speichert sie. Popup.js ruft sie aus dem Speicherbereich ab.
content_script.js
popup.js
"Änderungen" ist hier ein Objekt, das einen alten und einen neuen Wert für einen bestimmten Schlüssel enthält. Das Argument "AreaName" bezieht sich auf den Namen des Speicherbereichs, entweder "lokal", "synchronisieren" oder "verwaltet".
Denken Sie daran, die Speicherberechtigung in manifest.json zu deklarieren.
manifest.json
quelle
onChanged
Ereignis liefert bereits die Daten imchanges
Objekt. Achten Sie außerdem besonders aufnamespace
dieonChanged
Veranstaltung. Wenn Sie etwas mit speichernchrome.storage.local.set
, wird dasonChanged
Ereignis ausgelöst, aber das Lesen mitchrome.storage.sync.get
macht wenig Sinn.changes.visitedPages
wird undefiniert, wennvisitedPages
sie nicht geändert wurde. Wickeln Sie die Linie einif (changes.visitedPages) { ... }
, um dieses Problem zu lösen.Eine andere Option wäre die Verwendung der Chromspeicher-API. Dies ermöglicht die Speicherung von Benutzerdaten mit optionaler Synchronisierung zwischen Sitzungen.
Ein Nachteil ist, dass es asynchron ist.
https://developer.chrome.com/extensions/storage.html
quelle