0

ServiceWorker を使用して一部のアセットをキャッシュしています。すべてのファイルが正常にキャッシュされたらユーザーに知らせたいので、オフラインでコンテンツにアクセスできることをユーザーに認識させます。これを行う適切なタイミングはいつですか?

私はconsole.log()物事の流れを理解するためにいくつか持っています。ServiceWorker を登録する瞬間は次のとおりです。

if ('serviceWorker' in navigator) {
    navigator.serviceWorker.register('/serviceWorker.js')
        .then(function(registration) {
            console.log('* ServiceWorker registration successful');
        })
        .catch(function(err) {
            console.log('* ServiceWorker registration failed: ', err);
        });
}

ServiceWorker 内では次のようになります。

self.addEventListener('install', function(event) {
    console.log('* Installing Service Worker...');

    event.waitUntil(
        caches.open(cacheName).then(function(cache) {
            console.log('* Opened cache');
            return cache.addAll(filesToCache).then(function () {
                console.log('* Files have been cached!');
            });
        })
    );
});

コンソールには次のように表示されます。

* Installing Service Worker...
* Opened cache
* ServiceWorker registration successful
* Files have been cached!

したがって、この通知をトリガーする正しい瞬間は の後.addAll()であると考えているので、現在「ファイルがキャッシュされました!」と吐き出していますか? で実行すると便利ですがregister()、3 番目と最後のログ メッセージの間に遅延があるようです。その場合、ServiceWorker の内部にいるため、postMessage()この情報をクライアントに送信するのが最善の方法でしょうか?

ありがとう!

4

2 に答える 2

5

SW に登録すると、SW が解析されてインストールが開始されると、登録が取得されます。statechange イベントを使用して、その進行状況を追跡できます。

navigator.serviceWorker.register('/sw.js').then(function(reg) {
  if (!reg.installing) return;
  console.log("There is a ServiceWorker installing");

  var worker = reg.installing;
  worker.addEventListener('statechange', function() {
    if (worker.state == 'redundant') {
      console.log('Install failed');
    }
    if (worker.state == 'installed') {
      console.log('Install successful!');
    }
  });
});

これにより、インストール手順で何を行っているかに関係なく、インストールを追跡できます。よりきめ細かい通知が必要な場合は、postMessage を使用できます。

于 2015-05-31T22:09:41.760 に答える
0

「register()」関数は Service Worker のダウンロードとインストールの両方が完了すると完了します。そのため、ファイルがキャッシュされていない場合にインストール プロセスが中止された場合、「register()」が正常に完了した後でその通知を行うことができます。ただし、「addAll()」の後に通知を行うのがおそらく最も理にかなっています (特に、インストール プロセス中ではなく、ServiceWorker のインストール後にキャッシュを実行するようにコードを並べ替える場合)。「addAll()」関数は、キャッシュされたコンテンツを非同期的にディスクに書き込むため、完了するまでに時間がかかります。

于 2015-05-31T21:52:37.110 に答える