2017-11-02 10 views
0

이미지 캐싱 서비스 작업자가 있습니다.이 서비스 작업자는 프론트 엔드 템플릿에만 등록되어 있지만 여전히 내 관리 템플릿으로 확산됩니다.서비스 작업자가 확산 됨

이렇게하면 유효성 검사 토큰이 영향을 받아 양식이 예상치 않게 작동합니다.

일부 console.log에서 요청한 페이지에 도달하기 전에 설치 이벤트가 발생했지만 현재/다음 URL을 확인할 수 없습니다.

서비스 근로자가 관리 패널로 퍼져서 페이지를 방해하지 못하게하려면 어떻게해야합니까? 난 단지 자산 만 캐시하고 싶을 뿐이야.

이 내 서비스 노동자까지 그 관련성과 같습니다

const PRECACHE = 'precache-v1.0.0'; 
const RUNTIME = 'runtime'; 

// A list of local resources we always want to be cached. 
const PRECACHE_URLS = [ 
    "public", 
    "media", 
    "unify", 
]; 

importScripts('./cache-polyfill.js'); 

// The install handler takes care of precaching the resources we always need. 
self.addEventListener('install', function(event) { 
    console.log('installing resources'); 
    event.waitUntil(
     caches.open(PRECACHE) 
      //.then(cache => cache.addAll(PRECACHE_URLS)) 
      .then(self.skipWaiting()) 
    ); 
}); 

// The activate handler takes care of cleaning up old caches. 
self.addEventListener('activate', function(event) { 
    const currentCaches = [PRECACHE, RUNTIME]; 
    event.waitUntil(
     caches.keys().then(cacheNames => { 
      return cacheNames.filter(cacheName => !currentCaches.includes(cacheName)); 
     }).then(cachesToDelete => { 
      return Promise.all(cachesToDelete.map(cacheToDelete => { 
       return caches.delete(cacheToDelete); 
      })); 
     }).then(() => self.clients.claim()) 
    ); 
}); 

// The fetch handler serves responses for same-origin resources from a cache. 
// If no response is found, it populates the runtime cache with the response 
// from the network before returning it to the page. 
self.addEventListener('fetch', event => { 
    // Skip cross-origin requests, like those for Google Analytics. 

    if (event.request.method === "GET") { 
     if (event.request.url.indexOf(PRECACHE_URLS) > -1) { 
      console.log("fetching " + event.request.url + " by the service worker"); 
      event.respondWith(
       caches.match(event.request).then(cachedResponse => { 
        if (cachedResponse) { 
         return cachedResponse; 
        } 

        return caches.open(RUNTIME).then(cache => { 
         return fetch(event.request).then(response => { 
          // Put a copy of the response in the runtime cache. 
          return cache.put(event.request, response.clone()).then(() => { 
           console.log('cached: ' + event.request.url); 
           return response; 
          }); 
         }); 
        }); 
       }) 
      ); 
     } 
     else { 
      console.log("fetching " + event.request.url + " by service worker blocked, it's not a resource"); 
     } 
    } 
    return fetch(event.request); 
}); 

답변

1

문제는 관리자 페이지가 SW 범위 안에 놓여 있다는 가능성이 높습니다. 즉, SW 컨트롤을 의미합니다. /와 관리 페이지의 모든 내용은/admin /에 있습니다.

SW가 가로채는 가져 오기 요청을 확인하여 문제를 방지 할 수 있습니다. 예 :

이것은 SW의 가져 오기 수신기에서 가장 먼저해야합니다. 그것은 관리자 페이지에서 무언가에 대한 요청을 받았는지 여부를 확인한 다음 관리 페이지에서 취소합니다. 그렇지 않으면 정상적으로 계속됩니다.