서비스 작업자 캐시

Question

3 파일을 캐시해야하지만 다음과 같은 코드가 있습니다. wen 페이지를 다시로드하고 개발자 도구 및 네트워크에 파일을 입력하면 모든 파일이 서비스 담당자에게 전달됩니다. 올바른 코드와 해당 파일 3 개만 있습니다. 캐치되었거나 모든 파일이 잡혀 있습니까?

let cache_name = 'v1' 
let cache_files = [ 
'./style/general.css', 
'./style/authenticate.css', 
'./javascript/app.js' 
]; 


self.addEventListener('install',function(e){ 
    console.log('[ServiceWorker] installed') 
    e.waitUntil(
    caches.open(cache_name).then(function(cache){ 
    console.log('[ServiceWorker] Caching ',cache_files) 
    return cache.addAll(cache_files) 
    }) 
) 
}); 

self.addEventListener('activate',function(e){ 
    console.log('[ServiceWorker] activated') 
    e.waitUntil(
    caches.keys().then(function(cache_names){ 
     return Promise.all(cache_names.map(function(this_cache_name){ 
     if(this_cache_name !== cache_name){ 
      console.log('[ServiceWorker] removing cached files  from',this_cache_name) 
     return caches.delete(this_cache_name) 
    } 
    })) 
    }) 
) 
}) 

self.addEventListener('fetch',function(e){ 
    e.respondWith(
    caches.match(e.request).then(function(response) { 
     return response || fetch(e.request); 
    }) 
); 
}) 

그리고 어떤 파일이 캐시되고 어떤 캐시가 아닌지를 어떻게 알 수 있습니까?

Answer 1

귀하의 질문을 완전히 이해하지 못했습니다.

코드는 이런 일을 수행합니다 캐시에 미래에

캐시가 반복되고 활성화 설치에

• 배열에있는 3 개 개의 파일은 "V1"라는 이름의 캐시에 넣어 모든 항목을 그 클라이언트에서 이벤트를 가져 오기에
• (당신이 모든 "V1"항목이 자동으로 제거됩니다 미래에 "V2"를 cache_name 파를 변경하는 경우 즉,) 제거 캐시 이름 cache_name 파에 속하지 않는 캐시가 req에 대해 검사됩니다. uested 파일; SW가 캐시에서 파일을 찾으면 SW가 해당 요청을 네트워크에 전달합니다.

"응용 프로그램"탭의 "캐시 저장소를 통해 Chrome Dev 도구에서 캐시 된 파일을 검사 할 수 있습니다 "창 왼쪽에. 이 체크 아웃하고 아래로 스크롤 : 내 서비스 노동자도 내 안드로이드 전화에 filse 캐시를 thow하지 않을 이유가 내가 이걸 그리고 보여주는 Thnx을 https://developers.google.com/web/tools/chrome-devtools/manage-data/local-storage