从服务工作者访问localStorage

Question

我想定期从我的服务工作者调用API来发送存储在localStorage中的数据。当用户浏览我的网站时，将生成此数据并将其保存在localStorage中。考虑一下像在localStorage中保存统计信息并定期通过服务工作者发送它。我该怎么做？我知道我无法从服务工作者访问localStorage，并且必须使用postMessage API。任何帮助将受到高度赞赏。

Answer 1

您无法从Web工作进程访问localStorage（以及sessionStorage），结果将是undefined，这是出于安全原因。

您需要将postMessage()用于Worker的原始代码，并将该代码存储在localStorage中。

您应该使用localStorage.setItem()和localStorage.getItem()来保存并从本地存储中获取数据。

更多信息：

Worker.postMessage()

Window.localStorage

下面的伪代码，希望它能让你开始：

 // 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)

Answer 2

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

注意：localStorage的工作方式与服务工作者缓存类似，但它是同步的，因此不允许在服务工作者中使用。

注意：如果需要，可以在服务工作者内部使用IndexedDB进行数据存储。

这里还有一些讨论：How do I access the local storage using service workers in angular?