2017-04-23 16 views
0

앱을 완전히 오프라인에서 사용 가능하게 만들고 싶습니다. 즉, 온라인 및 모든 동적 페이지를 포함한 모든 페이지와 사이트의 자산을 캐싱 할 수있는 동안 사용자가 버튼을 클릭합니다 (또는 자동 스크롤이 발생할 수 있음).모든 사이트 페이지에서 sw-precache를 초기화하는 방법

나는 모든 자산 목록을 생성해야하며,이를 수행 할 수있는 도구 또는 sw-precache에 내장 된 방법이 필요하다는 것을 알고 있습니다.

또한 캐시의 크기는 얼마나되며 얼마나 사용할 수 있습니까? 사용자가 브라우저 캐시를 명확하게 지우지 않으면 어떤 크기 나 사용할 수 있다고 가정합니다.

답변

0

고정 된 파일 (HTML, JS, CSS 등)로 가득 찬 로컬 디렉토리가있는 경우 sw-precache은 전달한 패턴에 따라 자동으로 미리 캐시하도록 구성 할 수 있습니다 staticFileGlobs option. 사용자의 브라우저에서 이전에 미리 캐시 된 항목은 로컬 변경, service-worker.js 재생성 및 재배포시 최신 상태로 유지됩니다.

일반적으로 캐시 저장소 API를 사용하여 저장할 수있는 최대 데이터 양에는 엄격한 상한이 없습니다. 현재 사용 가능한 공간의 양 (잠재적으로 다른 휴리스틱과 함께)에 따라 다릅니다.

미리 캐시 된 파일을 결정할 때 사용자가 유용하다고 생각할 수있는 파일인지 확인해야합니다. 예를 들어 사용자가 (가설적인) 문서 사이트를 처음 방문하면 수천 개의 개별 HTML 문서가 다운로드되어 저장됩니다. 즉, 서버와 사용자 모두에게 대역폭 낭비입니다. 사용자의 기기.

모든 방문자가 선택 사항이거나 필요하지 않을 수있는 대규모 리소스가있는 경우 중요한 리소스에 대한 미리 설정 전략과 옵션 리소스 인 runtime caching strategy을 사용하는 것이 가장 좋습니다. 런타임 캐싱 전략을 최대 캐시 크기 또는 최대 보존 기간과 결합 할 수 있으며 기본 sw-toolbox 라이브러리가 이전 항목을 삭제 처리합니다.

+0

감사합니다. 저장 용량 제한에 대한 답변입니다. 나는 모든 콘텐츠를 캐시하기 위해 런타임 캐싱 설정을했습니다. 기본적으로 나는 동적으로 생성 된 것들 (업데이트 된 나의 질문)을 포함한 모든 페이지를 사용자가 캐시 할 수있게하고, 버튼을 클릭하여 완전한 오프라인 사용을 허용하고 싶습니다. 지금까지 내가 할 수있는 유일한 방법은 모든 페이지를 방문하여 캐시를 초기화하는 것일 뿐이므로 동적 변경시 다시 배포하지 않고 내장 캐시를 만들지 않았습니까? – riley

+0

미리 가능한 URL을 알고 있다면 동적 페이지를 미리 캐시 할 수 있으며 https://github.com/GoogleChrome/sw-precache#dynamicurlododependencies-objectstringarraystring 옵션을 사용하면됩니다. "버튼 클릭만으로"언급 했으므로, 당신은 희소하기보다는 오히려 캐시 온 디맨드를 원하게됩니다. 요구에 따라 캐시를 채우려면'window.caches'를 사용하여 페이지에서 캐시를 만든 다음 적절한 업데이트 전략 (예 :'가장 빠른 ')을 사용하여 캐시 된 응답을 제공하기 위해'runtimeCaching'을 통해 라우트를 설정하십시오. –