A maioria dos aplicativos baseados na Web funciona somente se você estiver on-line, o que torna um certo tipo de sentido. Mas HTML5 tem um mecanismo para forçar parte de uma página web e seus recursos para ser armazenado na máquina local para que você possa visualizá-lo enquanto estiver offline. Você pode ter uma página de identificar-se para este comportamento e tentar salvar uma cópia no automatically- máquina local, por exemplo:

 
Demonstração de armazenamento offline
 

Embora extremamente simples, esta página consegue obter recursos de vários arquivos diferentes. É claro, que requer que a imagem pot.jpg, mas também usa um arquivo javascript externo (offline.js) E uma folha de estilo externa (offline.css). HTML5 oferece um mecanismo que permite que o navegador para salvar automaticamente não só o arquivo HTML, mas todos os outros recursos de que necessita para exibir corretamente.

Você não iria construir uma página tão simples com tantas dependências externas, mas esse é o ponto deste exercício particular.

O segredo está em um arquivo especial chamado cache.manifest. Este arquivo especial é simplesmente um arquivo de texto que indica que outros arquivos são necessários para a página. Aqui está o conteúdo de cache.manifest para este exemplo particular:

CACHE MANIFESToffline.cssoffline.jspot.jpg

O arquivo deve começar com a frase CACHE MANIFEST (Tudo em maiúsculas). Cada linha subsequente deve conter o nome de um arquivo necessário para completar a página. É mais fácil se todos os arquivos estão no mesmo diretório, mas referências relativas são aceitáveis.

Siga estes passos para configurar uma página para o cache off-line:

1. Configurar seu servidor para gerenciar caches.

   O mecanismo de cache usa a text / manifesto Tipo de MIME. O servidor não pode ainda ser configurado para este tipo de dados. Se você estiver usando Apache, isso é fácil de corrigir. Procurar (ou criar) um arquivo de texto chamado .htaccess no diretório raiz do seu servidor web. Adicione a seguinte linha para este ficheiro:

   AddType text / manifest cache-manifesto

   Se você não tem permissão para adicionar ou modificar .htaccess ou você estiver usando outro servidor, você pode ter de pedir ao seu administrador do servidor para adicionar este tipo MIME.

2. Crie o seu arquivo de manifesto pela construção de um arquivo de texto chamado cache.manifest no mesmo diretório que o seu projeto.

   Faça a primeira linha de ler CACHE MANIFEST. Em cada linha subseqüente, listar um dos ativos a sua página irá precisar. Você pode precisar de olhar através de seu código-fonte para encontrar os vários elementos (normalmente imagens, CSS e arquivos javascript) que sua página vai precisar.

3. Criar a página da maneira normal.

   Mantenha o controle de todos os recursos externos que você pode precisar.

4. Indicam que sua página vai solicitar armazenamento local adicionando o manifesto atributo para a marca e um link para o seu cache.manifest Arquivo.

5. Carregar a página.

   Obviamente, você não pode testar o cache em uma máquina local (a menos que você estiver executando o seu próprio servidor web e teste através do http: // localhost endereço). Você vai precisar de carregar seus arquivos para um servidor. A primeira vez que você tentar acessar a página, o navegador provavelmente pedirá permissão para salvar dados localmente. Conceder permissão para fazê-lo.

6. Teste offline.

   Para ver se a página funciona, se desconectar da Internet (por desligar o seu celular ou desconectar o cabo de rede). Tente carregar a página novamente. Se você for bem sucedido, a página inteira será carregado.

Browsers já tem uma forma de cache que armazena automaticamente as páginas que o usuário tenha visitado, mas este tipo de cache é uma forma diferente, mais intencional de cache.

Note que você não pode colocar links para os ativos do lado do servidor no cache. A cache local não pode armazenar um programa PHP ou banco de dados. No entanto, você pode armazenar todos os dados que você precisa no cliente para o seu projecto irá ainda trabalhar sem uma conexão com o servidor.

Se você mudar de cache.manifest arquivo e reteste, o navegador não irá atualizar imediatamente. Isso é porque os navegadores são configurados para manter o cache atual para um par de horas. Se você testar novamente depois de um par de horas, você verá as alterações refletidas. Durante o teste, você pode transformar o cache do navegador automática off adicionando essas linhas ao seu .htaccess Arquivo:

ExpiresActive OnExpiresDefault "acesso"

Ela só faz sentido para desligar o cache do navegador em um servidor de teste. Deixe o comportamento de cache em seu nível padrão para um servidor de produção.

Se um dos arquivos de mudanças, mas o cache.manifest arquivo não, o navegador não sabe para recarregar o arquivo alterado. Se você quiser desencadear uma recarga de arquivos, você precisa mudar pelo menos um caractere na cache.manifest Arquivo. Isso pode ser um comentário, assim você pode simplesmente adicionar um número de versão como esta:

#Version 3

Alterar o número da versão irá desencadear o mecanismo de recarga da próxima vez que estiver online, então a versão off-line será atualizado.