HTML 5 애플리케이션 캐싱
HTML 5 애플리케이션 캐시
소개
HTML5를 사용하면 캐시 매니페스트 파일을 생성하여 웹 애플리케이션의 오프라인 버전을 쉽게 생성할 수 있습니다.
애플리케이션 캐시란 무엇인가요?
HTML5에는 인터넷 연결 없이 웹 애플리케이션을 캐시하고 액세스할 수 있는 애플리케이션 캐싱이 도입되었습니다.
애플리케이션 캐싱은 앱에 세 가지 이점을 제공합니다.
오프라인 검색 - 사용자가 오프라인 상태에서도 앱을 사용할 수 있습니다.
속도 - 캐시된 리소스가 더 빠르게 로드됩니다.
서버 로드 감소 - 브라우저는 서버에서 업데이트되거나 변경된 리소스만 다운로드합니다.
브라우저 지원
애플리케이션 캐싱은 Internet Explorer를 제외한 모든 주요 브라우저에서 지원됩니다.
HTML5 캐시 매니페스트 예
다음 예는 캐시 매니페스트가 있는 HTML 문서(오프라인 검색용)를 보여줍니다.
예
<!DOCTYPE HTML> <html manifest="demo.appcache"> <body> The content of the document...... </body> </html>
캐시 매니페스트 기본 사항
애플리케이션 캐싱을 활성화하려면 문서의 태그에 매니페스트 속성을 포함하세요.
<!DOCTYPE HTML> <html manifest="demo.appcache"> ... </html>
매니페스트를 지정하는 각 페이지는 사용자가 볼 때 표시됩니다. 액세스할 때 캐시됩니다. 매니페스트 속성이 지정되지 않으면 페이지가 캐시되지 않습니다(매니페스트 파일에 직접 지정되지 않는 한).
매니페스트 파일의 권장 파일 확장자는 ".appcache"입니다.
매니페스트 파일은 올바른 MIME 유형인 "text/cache-manifest"로 구성되어야 합니다. 웹 서버에서 구성해야 합니다.
매니페스트 파일
매니페스트 파일은 브라우저에 캐시된 것과 캐시되지 않은 것을 알려주는 간단한 텍스트 파일입니다.
매니페스트 파일은 세 부분으로 나눌 수 있습니다.
캐시 매니페스트 - 이 제목 아래에 나열된 파일은 첫 번째 다운로드 후 캐시됩니다.
네트워크 - 이 제목 아래에 보내는 파일이 필요합니다. 서버에 대한 연결이며 캐시되지 않습니다.
FALLBACK - 이 제목 아래 나열된 파일은 페이지에 액세스할 수 없을 때(예: 404 페이지)
CACHE MANIFEST
첫 번째 줄인 CACHE MANIFEST는 필수입니다.
CACHE MANIFEST /theme.css /logo.gif /main.js
위의 매니페스트 파일에는 CSS 파일, GIF 이미지, JavaScript 문서라는 세 가지 리소스가 나열되어 있습니다. 매니페스트 파일이 로드되면 브라우저는 웹 사이트의 루트 디렉터리에서 이 세 파일을 다운로드합니다. 그러면 사용자가 인터넷 연결을 끊을 때마다 이러한 리소스를 계속 사용할 수 있습니다.
NETWORK
다음 NETWORK 섹션에서는 "login.asp" 파일이 캐시되지 않으며 오프라인에서 사용할 수 없도록 지정합니다.
NETWORK: login.asp
시작 번호를 사용할 수 있습니다. 다른 모든 리소스/파일에 인터넷 연결이 필요함을 나타냅니다.
NETWORK: *
FALLBACK
아래 FALLBACK 하위 섹션에서는 인터넷 연결을 설정할 수 없는 경우 "offline.html"을 사용하도록 지정합니다. /html5 대신 / 디렉토리의 모든 파일:
FALLBACK: /html5/ /404.html
참고: 첫 번째 URI는 리소스이고 두 번째 URI는 대체입니다.
캐시 업데이트
앱이 캐시되면 다음이 발생할 때까지 캐시된 상태로 유지됩니다.
사용자가 브라우저 캐시를 지웁니다
매니페스트 파일이 수정됩니다(참조: 아래 팁)
프로그램별로 애플리케이션 캐시 업데이트
예 - 전체 매니페스트 파일
CACHE MANIFEST # 2012-02-21 v1.0.0 /theme.css /logo.gif /main.js NETWORK: login.asp FALLBACK: /html5/ /404.html
중요 사항: "#" 주석 줄로 시작하지만 다른 용도로 사용될 수 있습니다. 또한. 매니페스트 파일이 변경되면 애플리케이션 캐시가 업데이트됩니다. 이미지를 편집하거나 JavaScript 기능을 수정하는 경우 이러한 변경 사항은 다시 캐시되지 않습니다. 주석 줄에서 날짜와 버전 번호를 업데이트하면 브라우저가 파일을 다시 캐시하게 됩니다.
애플리케이션 캐싱 관련 참고사항
캐시된 콘텐츠에 주의하세요.
파일이 캐시되면 서버에서 파일을 수정하더라도 브라우저는 캐시된 버전을 계속 표시합니다. 브라우저가 캐시를 업데이트하도록 하려면 매니페스트 파일을 업데이트해야 합니다.
참고: 브라우저마다 캐시된 데이터에 대한 제한이 다를 수 있습니다(일부 브라우저는 사이트당 5MB의 제한을 설정합니다).
위 내용은 HTML 5 애플리케이션 캐시 내용입니다. 더 많은 관련 내용은 PHP 중국어 홈페이지(www.php.cn)를 참고해주세요!
핫 AI 도구
Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱
AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.
Undress AI Tool
무료로 이미지를 벗다
Clothoff.io
AI 옷 제거제
AI Hentai Generator
AI Hentai를 무료로 생성하십시오.
인기 기사
뜨거운 도구
메모장++7.3.1
사용하기 쉬운 무료 코드 편집기
SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.
스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경
드림위버 CS6
시각적 웹 개발 도구
SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)
뜨거운 주제
7442
15
1371
52
76
11
36
19
9
6
HTML의 테이블 테두리
Sep 04, 2024 pm 04:49 PM
HTML의 테이블 테두리 안내. 여기에서는 HTML의 테이블 테두리 예제를 사용하여 테이블 테두리를 정의하는 여러 가지 방법을 논의합니다.
HTML의 중첩 테이블
Sep 04, 2024 pm 04:49 PM
HTML의 Nested Table에 대한 안내입니다. 여기에서는 각 예와 함께 테이블 내에 테이블을 만드는 방법을 설명합니다.
HTML 여백-왼쪽
Sep 04, 2024 pm 04:48 PM
HTML 여백-왼쪽 안내. 여기에서는 HTML margin-left에 대한 간략한 개요와 코드 구현과 함께 예제를 논의합니다.
HTML 테이블 레이아웃
Sep 04, 2024 pm 04:54 PM
HTML 테이블 레이아웃 안내. 여기에서는 HTML 테이블 레이아웃의 값에 대해 예제 및 출력 n 세부 사항과 함께 논의합니다.
HTML 정렬 목록
Sep 04, 2024 pm 04:43 PM
HTML 순서 목록에 대한 안내입니다. 여기서는 HTML Ordered 목록 및 유형에 대한 소개와 각각의 예에 대해서도 설명합니다.
HTML 입력 자리 표시자
Sep 04, 2024 pm 04:54 PM
HTML 입력 자리 표시자 안내. 여기서는 코드 및 출력과 함께 HTML 입력 자리 표시자의 예를 논의합니다.
HTML에서 텍스트 이동
Sep 04, 2024 pm 04:45 PM
HTML에서 텍스트 이동 안내. 여기서는 Marquee 태그가 구문과 함께 작동하는 방식과 구현할 예제에 대해 소개합니다.
PHP에서 HTML/XML을 어떻게 구문 분석하고 처리합니까?
Feb 07, 2025 am 11:57 AM
이 튜토리얼은 PHP를 사용하여 XML 문서를 효율적으로 처리하는 방법을 보여줍니다. XML (Extensible Markup Language)은 인간의 가독성과 기계 구문 분석을 위해 설계된 다목적 텍스트 기반 마크 업 언어입니다. 일반적으로 데이터 저장 AN에 사용됩니다
