0

브라우저가 서비스 작업자를 지원하지 않는 경우 어떻게 캐시 매니페스트를 사용하도록 브라우저에 지시합니까?브라우저가 서비스 작업자를 지원하지 않는 경우 어떻게 캐시 매니페스트를 사용하도록 브라우저에 지시합니까?

오프라인으로 실행해야하는 Angular 4 앱이 있습니다. 서비스 종사자는 훌륭하게 작업하지만 Safari는 지원이 필요하지 않습니다. Safari는 실행해야하는 필수 브라우저입니다. 서비스 노동자가 캐시 매니페스트 파일을 사용하는 브라우저 다음 브라우저에서 지원되지 않는 경우 브라우저가 오프라인 상태가되면

나는 캐시 매니페스트 파일을 생성 할 필요가

현재 코드 (타이프) :

if ('serviceWorker' in navigator) { 
    navigator.serviceWorker.register('../../service-worker.js').then(function(registration) { 
    //TODO: Implement Logging 
    }).catch(function(err) { 
    //TODO: Implement Logging 
    }); 
} else { 
    //Not currently supported on Internet explorer, Safari, IE Mobile and Safari Mobile. Use old Application Caching instead. 
    console.log("Not Supported"); 
    //Use cache manifest 
} 

답변

1

매니페스트 파일의 모든 필수 속성을 사용하여 else 문에 <link> 요소를 생성하는 것은 어떻습니까? 난 당신이 <head>

const linkMeta = document.createElement('link'); 
linkMeta.setAttribute('rel', 'manifest'); 
linkMeta.setAttribute('href', '/manifest.webmanifes'); 

에 스크립트의 일부를 넣고 앱 캐시 매니페스트는 아이폰 OS에서 지원하는 <head>

+0

타이프 크립트로이 작업을 수행 할 수 있습니까? –

+0

물론 ... TS 파일에서 바닐라 JS를 작성할 수 있습니다. 왜냐하면, 머리 속에있는'script '는 다른 것입니다 ... JS 프레임 워크를 사용합니까? – DrNio

+0

나는 이런 식으로 말을했다. https://developer.mozilla.org/en-US/docs/Web/API/Document/createElement – DrNio

0

에 추가해야 할 것 같아요. 이것이 지난 10 년 동안 사이트를 오프라인으로 만드는 방법입니다. 페이지가 appCache 매니페스트와 서비스 작업자를 참조하면 서비스 작업자를 지원하는 브라우저는 appCache를 무시합니다.

또한 웹 매니페스트와 appCache 매니페스트를 혼동스럽게 생각한다고 생각합니다. 그들은 두 가지 별개의 것들입니다. appCache는 오프라인에서 파일을 캐시하는 방법을 관리합니다. 웹 매니페스트 파일은 브라우저에 메타 데이터를 제공하므로 한 번 화면에 추가되면 사이트에 브랜드를 지정하고 렌더링하는 방법을 알고 있습니다.

FWIW 내가 약 2010 년 이후 앱 캐시 및 로컬 스토리지/색인화를 사용하여 iOS의 라이벌 네이티브 응용 프로그램은 그래서 당신은 절대적으로 :)

을 할 수있는 오프라인/모바일 최초의 웹 애플리케이션을 구축 한 이것은 내가에 준 프리젠 테이션입니다 몇 년 전의 속도 https://youtu.be/GKxkzu0pHUc 그것은 당신을 도울지도 모른다.