웹 기반 애플리케이션에는 오프라인 액세스가 점점 더 중요 해지고 있습니다. 모든 브라우저에는 캐싱 메커니즘이 있지만 신뢰할 수있는 것은 아니며 항상 예상되는 역할을 수행하지는 않습니다. HTML5는 ApplicationCache 인터페이스를 사용하여 오프라인 사용으로 인한 일부 문제를 해결합니다.
다음은 HTML5 오프라인 캐시 매니페스트 파일의 응용 프로그램 및 코드 실제 사례를 설명하는 관련 컨텐츠입니다. 이 기사 자습서는 주로 HTML5 오프라인 캐시 매니페스트와 관련된 일부 기술 및 지식에 대해 이야기합니다. 자세한 내용은 http://www.vevb.com을 방문하여 더 많은 최신 자습서를 얻을 수 있습니다. 다음은 자습서 설명입니다.
매니페스트는 무엇입니까? Manifest는 접미사 이름 미니 페스트가있는 파일입니다. 파일에 캐시 해야하는 파일을 정의합니다. Manifest를 지원하는 브라우저는 Manifest 파일의 규칙에 따라 파일을 로컬로 저장하여 네트워크 링크없이 페이지에 액세스 할 수 있도록합니다.
웹 기반 애플리케이션에는 오프라인 액세스가 점점 더 중요 해지고 있습니다. 모든 브라우저에는 캐싱 메커니즘이 있지만 신뢰할 수있는 것은 아니며 항상 예상되는 역할을 수행하지는 않습니다. HTML5는 ApplicationCache 인터페이스를 사용하여 오프라인 사용으로 인한 일부 문제를 해결합니다.
캐시 인터페이스를 사용하면 응용 프로그램에 다음 세 가지 이점이 있습니다.
오프라인 브라우징 - 사용자는 오프라인에서 전체 웹 사이트를 탐색 할 수 있습니다.
속도- 캐시 된 자원은 로컬 리소스이므로 더 빨리로드됩니다.
서버로드 중단 - 브라우저는 변경된 서버에서 리소스 만 다운로드합니다.
App Cache (AppCache라고도 함)를 사용하면 개발자가 오프라인 사용자가 액세스 할 수있는 브라우저가 캐시 해야하는 파일을 지정할 수 있습니다. 오프라인시 사용자가 새로 고침 버튼을 누르더라도 앱이 일반적으로로드 및 실행됩니다.
참조 manifest 파일응용 프로그램에 대한 응용 프로그램 캐싱을 활성화하려면 문서의 HTML 태그에 매니페스트 속성을 추가하십시오.
매니페스트 속성은 절대 URL 또는 상대 경로를 가리킬 수 있지만 절대 URL은 해당 네트워크 응용 프로그램과 동일해야합니다. 매니페스트 파일은 파일 확장자를 사용할 수 있지만 올바른 MIME 유형이 제공되어야합니다 (아래 참조).
<html manifest =/cache.manifest> ... </html> 또는 <html manifest = http : //www.example.mf> ... </html>
캐시하려는 웹 앱의 각 페이지에 매니페스트 속성을 추가해야합니다. 페이지에 매니페스트 속성이 포함되어 있지 않으면 브라우저는 페이지를 캐시하지 않습니다 (매니페스트 파일에 명시 적으로 나열되지 않는 한).
이는 사용자가 매니페스트로 탐색하는 모든 웹 페이지가 응용 프로그램 캐시에 암시 적으로 추가 될 것임을 의미합니다. 따라서 목록에 각 페이지를 나열 할 필요가 없습니다.
매니페스트 파일은 텍스트/캐시 관리 MIME 유형에 제공되어야합니다. 파일 접미사 이름은 사용자 정의 (.manifest로 권장) 될 수 있으므로 .manifest 접미사의 파일 유형을 서버에서 텍스트/캐시-매니페스트로 선언해야합니다.
Apache를 예를 들어, 우리는 다음을 추가해야합니다 : AddType text/cache-manifest .manifest
간단한 목록 형식은 다음과 같습니다.
캐시 manifestindex.htmlstylesheet.cssimages/logo.pngscripts/main.js
이 예제는이 매니페스트 파일을 지정하는 웹 페이지의 4 개의 파일을 캐시합니다.
다음과 같은 점은 다음과 같이주의를 기울여야합니다.
캐시 매니페스트 문자열은 첫 번째 줄에 있어야하며 필수적입니다.
웹 사이트의 캐시 된 데이터 금액은 5MB를 초과하지 않아야합니다. 그러나 Chrome Web Store 용 앱을 작성하는 경우 UnlimitedStorage를 사용하여 제한을 무제한으로 만들 수 있습니다.
매니페스트 파일 또는 지정된 리소스를 다운로드 할 수없는 경우 전체 캐시 업데이트 프로세스를 수행 할 수 없습니다. 이 경우 브라우저는 원래 응용 프로그램 캐시를 계속 사용합니다.
더 복잡한 예를 살펴 보겠습니다.
캐시 매니페스트# 2010-06-18 : v2# 명시 적으로 캐시 된 '마스터 entries'.cache : /favicon.icoindex.htmlstylesheet.cssimages/logo.pngscripts/main.js# online.network:login.php/myapihttp://apiti.html. main.py가 접근 할 수없는 경우# offline.jpg는 이미지의 모든 이미지 대신에 제공됩니다./# offline.html은 다른 모든 .html filesfallback : /main.py /static.htmlimages/large/ images/offline.jpg*.html /offline.html 대신에 제공됩니다.
#로 시작하는 줄은 주석선이지만 다른 목적으로도 사용할 수 있습니다. 예를 들어 캐시를 업데이트하십시오
앱 캐시는 매니페스트 파일이 변경되는 경우에만 업데이트됩니다. 예를 들어, 이미지 리소스를 수정하거나 JavaScript 함수를 변경하면 이러한 변경 사항은 재구성되지 않습니다. 브라우저가 캐시 된 파일을 새로 고치게하려면 매니페스트 파일 자체를 수정해야합니다. 생성 된 버전 번호, 파일 해시 값 또는 타임 스탬프로 댓글 줄을 생성하여 사용자가 최신 버전의 소프트웨어를 얻을 수 있도록합니다.
업데이트 캐시 섹션에 설명 된대로 새 버전이 나타나면 캐시를 프로그래밍 방식으로 업데이트 할 수도 있습니다.
페이지가 캐시 매니페스트 파일을 소개하면 Manifest 파일에는 현재 페이지에서 요구하는 모든 파일 (CSS, JS, Image ...)이 포함되어야합니다. 그렇지 않으면로드되지 않습니다. 따라서 캐시해야 할 고정 파일을 제거하면 다른 모든 파일을 표시하기 위해 파일의 네트워크 항목에 별표*를 추가하는 것이 좋습니다.
목록에는 캐시, 네트워크 및 폴백의 세 가지 부분이 포함될 수 있습니다.
은닉처:이것은 항목의 기본 부분입니다. 이 헤더 아래에 나열된 파일은 처음으로 명시 적으로 캐시됩니다 (또는 캐시 매니페스트 직후 파일).
회로망:이 섹션에 나열된 파일은 서버에 연결 해야하는 화이트리스트 리소스입니다. 이러한 리소스에 대한 모든 요청은 사용자가 오프라인인지 아닌지에 관계없이 캐시를 우회합니다. 와일드 카드를 사용할 수 있습니다.
폴백 :이 섹션은 선택 사항이며 리소스에 액세스 할 수없는 경우 폴백 페이지를 지정하는 데 사용됩니다. 첫 번째 URI는 리소스를 나타내고 두 번째는 백업 웹 페이지를 나타냅니다.
끝. 튜토리얼이 여기에서 완료되었습니다. 독서에서 무언가를 얻었습니까? 이 사이트는 또한 HTML5 오프라인 캐시 매니페스트 관련 컨텐츠를 제공하며 계속 읽기에 오신 것을 환영합니다.