작업 영역 서비스 작업자 도구로 쿠키를 허용하고 302 리디렉션을 처리하는 방법은 무엇입니까?

SSR 기반의 반응 앱을 보유하고 있으며 현재 캐시 템플리트와 오프라인 기능을위한 Workbox 도구를 구현하고 있습니다. 나는 주로 사이트가 서버 측의 쿠키에 의존하고이를 기반으로 리디렉션을 발행하기 때문에 문제가 발생했습니다.작업 영역 서비스 작업자 도구로 쿠키를 허용하고 302 리디렉션을 처리하는 방법은 무엇입니까?

초기 부하는 잘 작동하지만 서비스 노동자 (SW) 일단 온라인 상태이고 자상 한 다른 새로 고침 결과가이 연장 상자 소스 내에서 URL로 전화를 가져 오는 일. 이 시간 동안 서버는 쿠키를 찾지 못하며 가져 오기에는 자격 증명 (예 : link)이 포함되지 않으며 다른 URL로 리디렉션 (302)을 실행합니다. 쿠키로 일부 옵션을 설정하고 이전 URL로 새로 고침 할 수 있습니다.
이 The FetchEvent for "http://localhost:8080/" resulted in a network error response: a redirected response was used for a request whose redirect mode is not "follow".
서버 문제 (302 개) 상태로 리디렉션 클라이언트 측에서 다음과 같은 오류가 발생하지만,의 클라이언트 결과 : 여기 site can’t be reached The web page at http://localhost:8080/ might be temporarily down or it may have moved permanently to a new web address. ERR_FAILED

내 서비스 작업자 코드 자산은 workbox-webpack 플러그인으로 채워집니다.

/* global importScripts, WorkboxSW */ 

importScripts('/client/workbox-sw.prod.js') 

// Create Workbox service worker instance 
const workboxSW = new WorkboxSW({ 
    clientsClaim: true, 
    cacheId: 'app-v3-sw', 
}) 

// Placeholder array which is populated automatically by workboxBuild.injectManifest() 
workboxSW.precache([]) 

// cache the offline html to be used as fallback navigation route. 
workboxSW.router.registerRoute(
    '/offline.html', 
    workboxSW.strategies.networkFirst({ 
     networkTimeoutSeconds: 2, 
     cacheableResponse: { statuses: [0, 200] }, 
    }) 
) 

// cache google api requests. 
workboxSW.router.registerRoute(
    /\.googleapis\.com$/, 
    workboxSW.strategies.staleWhileRevalidate({ 
     cacheName: 'v3-google-api-cache', 
     networkTimeoutSeconds: 2, 
     cacheableResponse: { statuses: [0, 200] }, 
    }) 
) 

// cache external requests. 
workboxSW.router.registerRoute(
    /(static\.clevertap\.com|www\.google-analytics\.com|wzrkt\.com|www\.googletagservices\.com|securepubads\.g\.doubleclick\.net|www\.googletagmanager\.com)/, 
    workboxSW.strategies.cacheFirst({ 
     cacheName: 'v3-externals-cache', 
     cacheExpiration: { 
      maxEntries: 30, 
     }, 
     cacheableResponse: { statuses: [0, 200] }, 
    }) 
) 

// Check if client can hit the url via network, if cannot then use the offline fallback html. 
// https://github.com/GoogleChrome/workbox/issues/796 
workboxSW.router.registerRoute(
    ({ event }) => event.request.mode === 'navigate', 
    ({ url }) => 
     // eslint-disable-next-line compat/compat 
     fetch(url.href).catch(() => caches.match('/offline.html')) 
)

P. 이것은 작업 상자 도구 또는 서비스 근로자가 처음 시도한 것으로 일부 세부 사항을 놓치거나 무시한 것일 수 있습니다. 친절하게 어떤 방향으로 나를 가리 킵니다. 기본적으로

출처

2017-10-30 aga5tya

내가 오프라인 경로를 확인할 때 등록 된 경로. 내가 그걸 놓쳤다는 것이 나쁘다. 옵션 수용이 가져올 변화 { \t \t \t 자격 증명을 '포함', \t \t \t 리디렉션 '에 따라' \t \t}이 문제를 해결합니다. – aga5tya

사회자,이 질문을 마감하십시오. – aga5tya

, fetch는 쿠키를 전달하지 않습니다, 그래서 당신은 옵션에서 자격 증명을 추가해야합니다 : 여기

workboxSW.router.registerRoute(
    ({ event }) => event.request.mode === 'navigate', 
    ({ url }) => fetch(url.href, {credentials: 'same-origin'}).catch(() => caches.match('/offline.html')) 
)

더 많은 정보 : 그것은 실제로 지난 의해 발생되고 있었다 https://github.com/github/fetch#sending-cookies

출처

2018-03-02 17:39:05

작업 영역 서비스 작업자 도구로 쿠키를 허용하고 302 리디렉션을 처리하는 방법은 무엇입니까?

답변

관련 문제