停電後、Chromeはキャッシュを使用しませんか？

Question

私はディスプレイエンジンとしてChromeを使用するデジタルサイネージプレーヤーを作成しています。あまりにも多くの中断なしにネットワークがダウンした場合、私たちはまだまだ混乱する必要があります。

Chromeは画像をうまくキャッシュしています。アクセスの1か月後に「Exipres」ヘッダーを設定しました。私はプレーヤーのコンピュータをオフラインに設定し、何日も問題なくアプリを稼働させることができます。正しい方法でマシンを再起動すると（スタート - >シャットダウン）、キャッシングは期待どおりに機能します。

問題は、再起動時にChromeが異常終了した場合（クラッシュまたは停電のいずれか）、Chromeはキャッシュを無視して画像の読み込みを拒否することです。これは、ページをロードしてから5分後に電源を切るとコンテンツが失効しない場合に発生します。

私の推測では、異常終了後にキャッシュを無視して、破損したキャッシュがブラウザを絶えずクラッシュさせないようにすると思います。しかし、この動作は私が必要とするものではありません。

誰かがコマンドライン引数またはフラグを知っていますが、これを起こさないように設定できますか？

ありがとうございました。

Answer 1

私は、Chromeがシステム障害でローカルキャッシュを無効にしないようにするために考えていたすべてを試して、空になった。同じ質問をしている他の人がいくつかいますが、私は答えを見ませんでした。

これは私がこの作業をしたことであり、他の人が同じ問題を抱えている場合は、必要な回避策かもしれません。

イメージをキャッシュするサービスワーカーを追加しました。以下のコードはまだ完璧ではありませんが、誰かのための出発場所でなければなりません...（参考、5分前にこのことを学んだので、

レスポンスの種類が「cors」のものはすべてキャッシュして、リモートサーバーからの画像のみをキャッシュします。これが機能するには、画像をhttps経由で読み込む必要があります。

撮影

（ほとんど）から：https://developers.google.com/web/fundamentals/getting-started/primers/service-workers

var CACHE_NAME = 'shine_cache'; 
var urlsToCache = [ 
    '/' 
]; 

self.addEventListener('install', function(event) { 
    // Perform install steps 
    event.waitUntil(
    caches.open(CACHE_NAME) 
     .then(function(cache) { 
     console.log('Opened cache'); 
     return cache.addAll(urlsToCache); 
     }) 
); 
}); 

self.addEventListener('fetch', function(event) { 
    //console.log('Handling fetch event for', event.request); 
    if (event.request.method == 'POST') { 
     //console.log("Skipping POST"); 
     event.respondWith(fetch(event.request)); 
     return; 
    } 
    if (event.request.headers.get('Accept').indexOf('image') !== -1) { 
     event.respondWith(
      caches.match(event.request) 
      .then(function(response) { 
       // Cache hit - return response 
       if (response) { 
        console.log("Returning from cache.", event.request); 
        return response; 
       } 

       // IMPORTANT: Clone the request. A request is a stream and 
       // can only be consumed once. Since we are consuming this 
       // once by cache and once by the browser for fetch, we need 
       // to clone the response. 
       var fetchRequest = event.request.clone(); 

       return fetch(fetchRequest).then(
        function(response) { 
         console.log("Have a response.", response); 
         // Check if we received a valid response 
         if(!response || response.status !== 200 || response.type !== 'cors') { 
          return response; 
         } 

         // IMPORTANT: Clone the response. A response is a stream 
         // and because we want the browser to consume the response 
         // as well as the cache consuming the response, we need 
         // to clone it so we have two streams. 
         var responseToCache = response.clone(); 

         caches.open(CACHE_NAME) 
         .then(function(cache) { 
          console.log("Caching response", event.request); 
          cache.put(event.request, responseToCache); 
         }); 

         return response; 
        } 
       ); 
      }) 
     ); 
    } 
});