JavaScript

[ServiceWorker] ブラウザのjsからServiceWorkerに値を渡す

前提

  1. hoge.phpにリクエストを投げる。
  2. そのレスポンスにあるfugaというデータをServiceWorkerの中で使いたい。

ソース

レスポンスを受け取ったxxx.jsからmessageイベントを利用すると、たぶん一番簡便。

xxx.js
if ('serviceWorker' in navigator) {
    navigator.serviceWorker.controller.postMessage({type: 'hoge', fuga: xxx});
}

ブラウザ側ではこうやっておいて…

ServiceWorker.js
self.addEventListener('message', event => {
    switch (event.data.type) {
        case 'hoge':
            console.log(event.data.fuga);
            break;
    }
});

こうやる、と (´・ω・`)