Làm cách nào để xóa bộ nhớ cache của nhân viên dịch vụ?

Question

Vì vậy, tôi có một trang HTML với nhân viên dịch vụ, bộ nhớ cache của nhân viên dịch vụ index.html và các tệp JS của tôi.

Vấn đề là khi tôi thay đổi JS, thay đổi không hiển thị trực tiếp trên trình duyệt của khách hàng. Tất nhiên trong chrome dev-tools, tôi có thể tắt cache. Nhưng trong chrome mobile, làm cách nào để làm điều đó?

Tôi đã cố gắng truy cập cài đặt trang web và nhấn nút XÓA RESET%. Nhưng nó vẫn tải trang cũ/tải từ bộ nhớ cache. Tôi đã cố gắng sử dụng trình duyệt ẩn danh khác hoặc chrome và tải trang mới.

Sau đó, tôi cố gắng xóa dữ liệu duyệt web của mình (chỉ bộ nhớ cache) và nó hoạt động.

Tôi đoán đó không phải là cách hoạt động đúng? người dùng của tôi sẽ không biết liệu trang có được cập nhật hay không mà không xóa bộ nhớ cache của trình duyệt chrome.

Answer 1

Sử dụng này để xóa bộ nhớ cache lỗi thời:

self.addEventListener('activate', function(event) { 
    event.waitUntil(
    caches.keys().then(function(cacheNames) { 
     return Promise.all(
     cacheNames.filter(function(cacheName) { 
      // Return true if you want to remove this cache, 
      // but remember that caches are shared across 
      // the whole origin 
     }).map(function(cacheName) { 
      return caches.delete(cacheName); 
     }) 
    ); 
    }) 
); 
}); 

Answer 2

_{Các other answer là một chút dài dòng và không nhiều hơn so với nhu cầu của câu hỏi, và đưa thiếu hoàn chỉnh của nó giải thích nó đòi hỏi một chút phân tích cú pháp trên danh nghĩa của người dùng để họ thay đổi nó thành thứ gì đó phù hợp với họ. Vì vậy, đây là đơn giản hơn;}

Nếu bạn biết tên bộ nhớ cache bạn chỉ có thể gọi caches.delete() từ bất cứ nơi nào bạn thích trong người lao động:

caches.delete(/*name*/); 

Và nếu bạn muốn xóa sạch tất cả các bộ nhớ đệm (và không phải chờ đợi cho họ, nói điều này là tác vụ nền), bạn chỉ cần add this:

caches.keys().then(function(names) { 
    for (let name of names) 
     caches.delete(name); 
});