O acesso offline está se tornando cada vez mais importante para aplicativos baseados na Web. Embora todos os navegadores tenham mecanismos de cache, eles não são confiáveis e nem sempre desempenham o papel esperado. O HTML5 usa a interface ApplicationCache para resolver alguns dos problemas causados pelo uso offline.
A seguir, é apresentado o conteúdo relevante que explica os casos práticos do aplicativo e o código dos arquivos de manifestos de cache offline HTML5. O tutorial do artigo fala principalmente sobre algumas tecnologias e conhecimentos relacionados ao manifesto de cache offline HTML5. Para mais conteúdo, você pode visitar http://www.vevb.com para obter mais tutoriais mais recentes. A seguir, a explicação do tutorial:
O que é manifesto? Manifest é um arquivo com o nome do sufixo minifest. Ele define arquivos que precisam ser armazenados em cache no arquivo. O navegador que suporta manifesto salvará o arquivo localmente de acordo com as regras do arquivo de manifesto, para que a página possa ser acessada sem links de rede.
O acesso offline está se tornando cada vez mais importante para aplicativos baseados na Web. Embora todos os navegadores tenham mecanismos de cache, eles não são confiáveis e nem sempre desempenham o papel esperado. O HTML5 usa a interface ApplicationCache para resolver alguns dos problemas causados pelo uso offline.
O uso de uma interface de cache pode trazer os três benefícios a seguir para o seu aplicativo:
Navegação offline - os usuários podem navegar seu site completo enquanto offline
Velocidade- O recurso em cache é um recurso local, por isso carrega mais rápido.
Carga do servidor Menos - o navegador apenas baixa recursos do servidor que mudou.
O App Cache (também conhecido como AppCache) permite que os desenvolvedores especifiquem quais arquivos o navegador deve cache para os usuários offline acessarem. Seu aplicativo carregará e executará normalmente, mesmo que o usuário pressione o botão de atualização quando está offline.
Arquivo de manifesto de referênciaPara ativar o cache do aplicativo para um aplicativo, adicione o atributo de manifesto na tag HTML do documento:
A propriedade Manifest pode apontar para um URL absoluto ou um caminho relativo, mas o URL absoluto deve ser o mesmo que o aplicativo de rede correspondente. O arquivo de manifesto pode usar qualquer extensão de arquivo, mas deve receber o tipo MIME correto (veja abaixo).
<html manifesto =/cache.manifest> ... </html> ou <html manifesto = http: //www.example.com/example.mf> ... </html>
Você deve adicionar a propriedade Manifest em cada página do aplicativo da web que deseja armazenar em cache. Se a página não conter o atributo manifesto, o navegador não cache a página (a menos que esteja explicitamente listada no arquivo de manifesto).
Isso significa que todas as páginas da web que o usuário navega com o manifesto serão implicitamente adicionadas ao cache do aplicativo. Portanto, você não precisa listar cada página da lista.
O arquivo de manifesto deve ser fornecido no tipo MIME Text/Cache-manifest. O nome do sufixo do arquivo pode ser personalizado (recomendado como .Manifest), portanto, precisamos declarar o tipo de arquivo do sufixo .manifest como texto/manifestante de texto/cache no servidor.
Tomando o Apache como exemplo, precisamos adicionar: AddType text/cache-manifest .manifest
O formato da lista simples é o seguinte:
Cache manifestindex.htmlstylesheet.cssimages/logo.pngscripts/main.js
Este exemplo armazena em cache quatro arquivos na página da web que especificam esse arquivo de manifesto.
Os seguintes pontos em que você precisa prestar atenção:
A sequência de manifesto do cache deve estar na primeira linha e é essencial.
A quantidade de dados em cache no site não deve exceder 5 MB. No entanto, se você estiver escrevendo um aplicativo para a Chrome Web Store, poderá usar o UnlimitedStorage para ilimitar as restrições.
Se o arquivo de manifesto ou o recurso especificado nele não puder ser baixado, todo o processo de atualização do cache não poderá ser executado. Nesse caso, o navegador continuará a usar o cache de aplicativo original.
Vamos dar uma olhada em exemplos mais complexos:
Manifesto de cache# 2010-06-18: V2# explicitamente em cache 'entradas mestras'.cache: /favicon.icoindex.htmlstylesheet.cssimages/logo.pngscripts/main.js# Recursos que requerem o usuário online.network:login.phps/mymymypks) static.html será servido se o main.py for inacessível# offline.jpg for servido no lugar de todas as imagens em imagens/grande/# offline.html será servido no lugar de todos os outros .html filesfallback: /main.py /static.htmlimages/large/ imagens/offline.jpg*.
Linhas que começam com # são linhas de comentários, mas também podem ser usadas para outros fins. Por exemplo, atualize o cache
O cache do aplicativo é atualizado apenas se seu arquivo manifesto for alterado. Por exemplo, se você modificar um recurso de imagem ou alterar uma função JavaScript, essas alterações não serão recuperadas. Você deve modificar o próprio arquivo de manifesto para que o navegador atualize o arquivo em cache. Crie linhas de comentários com números de versão gerados, valores de hash de arquivo ou registro de data e hora para garantir que os usuários obtenham a versão mais recente do seu software.
Você também pode atualizar programaticamente o cache após a exibição de uma nova versão, conforme descrito na seção de cache de atualização.
Se a página introduzir um arquivo de manifesto de cache, o arquivo de manifesto deverá conter todos os arquivos (CSS, JS, imagem ...) exigidos pela página atual, caso contrário, ele não será carregado. Portanto, se você remover os arquivos fixos que precisam ser armazenados em cache, é recomendável adicionar um asterisco* ao item de rede no arquivo para indicar todos os outros arquivos.
A lista pode incluir três partes diferentes: cache, rede e fallback.
Cache:Esta é a parte padrão da entrada. Os arquivos listados neste cabeçalho são explicitamente armazenados em cache pela primeira vez (ou arquivos imediatamente após o manifesto do cache).
REDE:Os arquivos listados nesta seção são recursos da lista de permissões que precisam ser conectados ao servidor. Todas as solicitações a esses recursos ignoram o cache, independentemente de o usuário estar offline ou não. Os curingas podem ser usados.
CAIR PRA TRÁS:Esta seção é opcional e é usada para especificar a página Fallback quando o recurso não estiver acessível. O primeiro URI representa o recurso e o segundo representa a página da web de backup.
Fim. O tutorial foi concluído aqui. Você ganhou algo da leitura? Este site também fornece conteúdo relacionado ao manifesto do cache offline HTML5, bem -vindo a continuar lendo.