0

次の構成でオフライン機能を追加するために、jekyll Web サイトで sw-precache を使用しています。

gulp.task('generate-service-worker', function(cb) {
  var path = require('path');
  var swPrecache = require('sw-precache');
  var rootDir = '_site';
  var packageJson = require('./package.json');

  swPrecache.write('./service-worker.js', {
    staticFileGlobs: [rootDir + '/**/*.{html,css,png,jpg,gif,svg}', rootDir + '/js/*'],
    stripPrefix: rootDir + '/',
    runtimeCaching: [{
      urlPattern: /\/$/,
      handler: 'networkOnly'
    }],
    handleFetch: argv.cacheAssets || false,
    maximumFileSizeToCacheInBytes: 10485760, // 10 mb
    cacheId: packageJson.name + '-v' + packageJson.version
  }, cb);
});

問題は、Web サイトのコンテンツ (たとえば、ブログ投稿のテキスト、またはインデックス ページのテキスト) を変更すると、新しい Serviceworker バージョンがインストールされ、ブラウザーが更新されるまで変更が表示されないことです。もちろん、これは の予想される動作ですcacheFirst。

私が望むのは、サイトのインデックスへのリクエストを常に最初にネットワークにすることです。これが私がここで試していることです:

runtimeCaching: [{
  urlPattern: /\/$/,
  handler: 'networkFirst'
}]

しかし、これは機能していません。インデックスは常にネットワークからではなくサービスワーカーからフェッチされます。どうすればこれを達成できますか?

4

3 に答える 3

0

私の問題は、 precache: の実際のページ コンテンツを含めていたことです'/**/*.{html,css,png,jpg,gif,svg}'。

html ファイルを除外すると、期待どおりに動作します。

'/**/*.{css,png,jpg,gif,svg}'
于 2017-03-30T23:17:26.147 に答える