web-dev-qa-db-fra.com

Accéder à localStorage à partir du service worker

Je souhaite appeler périodiquement une API de mon technicien pour envoyer des données stockées dans le localStorage. Ces données seront produites et enregistrées dans localStorage lorsqu'un utilisateur naviguera sur mon site Web. Considérez cela comme enregistrer des statistiques dans localStorage et l'envoyer périodiquement via le service worker. Comment dois-je procéder? Je comprends que je ne peux pas accéder à localStorage à partir du service worker et que je devrai utiliser l'API postMessage. Toute aide serait très appréciée.

javascripthtmlservice-workerweb-worker
10
Faiz

Vous ne pouvez pas accéder à localStorage (et aussi à sessionStorage) à partir d'un processus de travail Web, leur résultat sera undefined, ceci pour des raisons de sécurité.

Vous devez utiliser postMessage() pour revenir au code d'origine du Worker et que ce code stocke les données dans localStorage.

Vous devez utiliser localStorage.setItem() et localStorage.getItem() pour enregistrer et obtenir des données du stockage local.

Plus d'informations:

Worker.postMessage ()

Window.localStorage

Pseudo-code ci-dessous, en espérant que cela vous aide à démarrer:

 // include your worker
 var myWorker = new Worker('YourWorker.js'),
   data,
   changeData = function() {
     // save data to local storage
     localStorage.setItem('data', (new Date).getTime().toString());
     // get data from local storage
     data = localStorage.getItem('data');
     sendToWorker();
   },
   sendToWorker = function() {
     // send data to your worker
     myWorker.postMessage({
       data: data
     });
   };
 setInterval(changeData, 1000)
10
GibboK

https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers dit

Remarque: localStorage fonctionne de la même manière que le cache de service worker, mais il est synchrone, donc non autorisé dans les travailleurs de service.

Remarque: IndexedDB peut être utilisé dans un technicien de service pour le stockage de données si vous en avez besoin.

Il y a aussi un peu de discussion ici: Comment puis-je accéder au stockage local en utilisant des travailleurs de service en angulaire?

1
Alex028502

J'utilise ce package appelé localforage qui fournit une interface de type localStorage qui entoure IndexedDB. https://github.com/localForage/localForage

Vous pouvez ensuite l'importer en le plaçant dans votre répertoire public, afin qu'il soit servi par votre serveur Web, puis en appelant: self.importScripts('localforage.js'); au sein de votre technicien de service.

0
Allen