O suporte ao desenvolvimento de aplicativos Web offline é outro foco do HTML5. Os chamados aplicativos da web offline são aplicativos que ainda podem ser executados mesmo quando o dispositivo não consegue acessar a Internet.
O desenvolvimento de aplicativos da web offline requer várias etapas. A primeira é garantir que o aplicativo saiba se o dispositivo tem acesso à Internet para que possa tomar a ação correta a seguir. Então, a aplicação também deve ter acesso a determinados recursos (imagens, Javascript, CSS, etc.) para funcionar corretamente. O melhor é que deve haver um espaço local para os usuários salvarem os dados, e a leitura e a escrita não serão prejudicadas, independentemente de terem acesso à Internet.
HTML5 e suas APIs relacionadas tornam o desenvolvimento de aplicativos offline uma realidade.
Detecção off-linePara saber se o dispositivo está online ou offline, o HTML5 define um atributo navigator.onLine. Um valor true indica que o dispositivo pode acessar a Internet e um valor false indica que o dispositivo está offline.
if (navigator.onLine) { // Trabalhar normalmente} else { // Executar tarefas no estado offline}Como navigator.onLine apresenta alguns problemas de compatibilidade, além do atributo navigator.onLine, para melhor determinar se a rede está disponível, o HTML5 também define dois eventos, online e offline.
Esses dois eventos são acionados no objeto window quando a rede alterna entre offline e online:
window.addEventListener('online', function() { // Funciona normalmente}); window.addEventListener('offline', function() { // Executa tarefas quando offline});Em aplicações práticas, é melhor obter o estado inicial por meio de navigator.onLine após o carregamento da página. Em seguida, use os dois eventos acima para determinar se o status da conexão de rede muda. Quando o evento acima for acionado, o valor da propriedade navigator.onLine também será alterado, mas esta propriedade deverá ser pesquisada manualmente para detectar alterações no status da rede.
cache do aplicativoO cache de aplicativo do HTML5, ou appcache, é projetado especificamente para o desenvolvimento de aplicativos da web offline. Appcache é uma área de cache separada do cache do navegador. Para salvar dados nesse cache, use um arquivo manifesto que liste os recursos a serem baixados e armazenados em cache. Exemplo de arquivo de descrição:
MANIFESTO DE CACHE# Commentfile.jsfile.css
Então cite em html:
<html manifesto=./xxx.manifest>
O tipo MIME do arquivo xxx.manifest deve ser text/cache-manifest.
O núcleo desta API é o objeto applicationCache. Este objeto possui um atributo de status. O valor do atributo é uma constante, indicando o seguinte status atual do cache do aplicativo.
Eventos relacionados:
De modo geral, esses eventos serão acionados na ordem mencionada acima conforme a página carrega. Os eventos acima também podem ser acionados manualmente chamando o método update().
armazenamento de dados BiscoitosCookies HTTP, geralmente chamados diretamente de cookies, são usados no cliente para armazenar informações da sessão. O padrão exige que o servidor envie o cabeçalho HTTP Set-Cookie como parte da resposta a qualquer solicitação HTTP, que contém informações da sessão. Exemplo de cabeçalho de resposta do servidor:
HTTP/1.1 200 OK
Tipo de conteúdo: texto/html
Set-Cookie: nome = valor
Outro cabeçalho: valor de outro cabeçalho
O navegador então define os cookies das informações da sessão e, em seguida, adiciona o cabeçalho Cookie HTTP a cada solicitação para enviar as informações de volta ao servidor, conforme mostrado abaixo:
OBTER /index.html HTTP/1.1
Cookie: nome=valor
Outro cabeçalho: valor de outro cabeçalho
As informações adicionais enviadas de volta ao servidor podem ser usadas para verificar exclusivamente de qual solicitação o cliente veio.
Os cookies completos incluem: