2014-05-15 2 views
1

Il semble que offline app est pris en charge sur la plupart des navigateurs. je copiais l'exemple d'application de WHATWG et le mettre sur un serveur Web, mais il ne fonctionne pas quand je test avec les étapes ci-dessous:Pourquoi l'application Web hors connexion ne fonctionne pas?

  1. Parcourir pour clock.html avec windows phone 8.1 (IE 11)
  2. la page semble bien, puis quittez le navigateur
  3. désactiver les données wifi et cellulaires
  4. Parcourir à nouveau clock.html mais se Cannot find server or DNS error

Je ne naviguez en mode privé et n'a pas effacé le cache du navigateur. Je ne sais pas si cela est encore spécifique à Windows Phone, mais je vais tester avec d'autres appareils plus tard.

clock.appcache

CACHE MANIFEST 
CACHE: 
clock.html 
clock.css 
clock.js 

clock.html

<!DOCTYPE html> 
<html manifest="clock.appcache"> 
<head> 
    <title>Clock</title> 
    <script src="clock.js"></script> 
    <link rel="stylesheet" href="clock.css"> 
</head> 

<body onload="updateIndicator()" ononline="updateIndicator()" onoffline="updateIndicator()"> 
    <div>The network is: <span id="indicator">(state unknown)</span></div> 
    <div>The time is: <span id="clock"></span></div> 
</body> 

</html> 

clock.css

.clock { font: 2em sans-serif; } 

clock.js

setInterval(function() { 
    document.getElementById('clock').innerHTML = new Date(); 
}, 1000); 

function updateIndicator() { 
    document.getElementById('indicator').innerHTML = navigator.onLine ? 'online' : 'offline'; 
} 

Répondre

1

clock.appcache doit être servi avec le type mime correct text/cache-manifest. La plupart des serveurs ne le font pas par défaut. Vous devrez modifier le fichier web.config ou .htaccess avec le paramètre correct.

IIS https://stackoverflow.com/a/7118481/195050

Apache https://stackoverflow.com/a/3281574/195050

+0

lorsque déconnecté, l'actualisation de la page me redonnera la même erreur. Des idées pour résoudre cela? –

+0

@RayCheng Il pourrait s'agir des en-têtes de cache. 'no-store' causera des problèmes. D'autres comme 'private' pourraient mais je ne suis pas sûr. Ces en-têtes sont parfois définis automatiquement si le fichier nécessite une authentification pour accéder ou est généré par le code. – Nicholas

2

J'ai construit une application en ligne qui utilise cette technique et fonctionne bien dans tous les navigateurs, mais je l'ai connu le même problème que vous le IE11 sur Windows Phone 8.1 aussi. J'ai écrit à propos de ce problème ici: http://forums.wpcentral.com/windows-phone-8-1-preview-developers/274574-91.htm#post2585711

Il semble que si vous chargez la page, passer en mode vol, puis actualisez, vous recevez l'erreur DNS mentionné (lorsque vous attendez le navigateur pour charger la page à partir du cache). Il y a une solution de contournement que j'ai trouvée: charger la page, la marquer (et l'épingler à la page d'accueil si vous le souhaitez), quitter le navigateur, passer en mode avion, puis rouvrir le navigateur et charger la page en utilisant votre signet seulement. Il devrait charger le site OK. Ne tapez pas rafraîchir - il semble que ce soit la fonction d'actualisation qui le tue.

+1

La solution de contournement ne fonctionne pas. Il se charge très bien tant que je ne rafraîchis pas en mode hors connexion, même chargé à partir du signet après l'actualisation en mode hors connexion, cela ne fonctionnera plus. –

+0

Je pense que vous avez décrit le même processus que moi - essentiellement, il utilise un rafraîchissement qui semble le casser. –

Questions connexes