cache.manifest fonctionne la première fois puis échoue

Question

J'essaie d'ajouter la mise en cache html 5 à une application web, rien de trop complexe juste images/css/js.

Quand je charge la page après la modification du fichier cache.manifest je reçois le débogage suivant dans Chrome 8:

Creating Application Cache with manifest http://example.com/themes/zenmobile/cache.manifest 
Application Cache Checking event 
Application Cache Downloading event 
Application Cache Progress event (0 of 26) http://example.com/themes/zenmobile/plugins/img/toolbar.png 
Application Cache Progress event (1 of 26) http://example.com/themes/zenmobile/plugins/img/greenButton.png 
Application Cache Progress event (2 of 26) http://example.com/themes/zenmobile/plugins/jqtouch.transitions.js 
Application Cache Progress event (3 of 26) http://example.com/themes/zenmobile/plugins/img/back_button_clicked.png 
Application Cache Progress event (4 of 26) http://example.com/themes/zenmobile/plugins/img/button.png 
Application Cache Progress event (5 of 26) http://quizible.com/sites/all/modules/jquery_update/replace/jquery.min.js 
Application Cache Progress event (6 of 26) http://example.com/themes/zenmobile/plugins/img/grayButton.png 
Application Cache Progress event (7 of 26) http://example.com/themes/zenmobile/plugins/img/chevron_circle.png 
Application Cache Progress event (8 of 26) http://example.com/themes/zenmobile/plugins/img/on_off.png 
Application Cache Progress event (9 of 26) http://example.com/themes/zenmobile/plugins/jqtouch.js 
Application Cache Progress event (10 of 26) http://example.com/themes/zenmobile/layout.css 
Application Cache Progress event (11 of 26) http://example.com/themes/zenmobile/plugins/img/chevron.png 
Application Cache Progress event (12 of 26) http://example.com/themes/zenmobile/plugins/img/rowhead.png 
Application Cache Progress event (13 of 26) http://example.com/themes/zenmobile/zenmobile.css 
Application Cache Progress event (14 of 26) http://example.com/themes/zenmobile/plugins/img/loading.gif 
Application Cache Progress event (15 of 26) http://example.com/themes/zenmobile/plugins/img/redButton.png 
Application Cache Progress event (16 of 26) http://example.com/themes/zenmobile/plugins/img/activeButton.png 
Application Cache Progress event (17 of 26) http://example.com/themes/zenmobile/images/bg_body.png 
Application Cache Progress event (18 of 26) http://example.com/themes/zenmobile/plugins/theme.css 
Application Cache Progress event (19 of 26) http://example.com/themes/zenmobile/plugins/img/toggle.png 
Application Cache Progress event (20 of 26) http://example.com/themes/zenmobile/plugins/img/whiteButton.png 
Application Cache Progress event (21 of 26) http://example.com/themes/zenmobile/plugins/img/toggleOn.png 
Application Cache Progress event (22 of 26) http://example.com/themes/zenmobile/plugins/jqtouch.css 
Application Cache Progress event (23 of 26) http://example.com/themes/zenmobile/plugins/img/button_clicked.png 
Application Cache Progress event (24 of 26) http://example.com/themes/zenmobile/plugins/img/back_button.png 
Application Cache Progress event (25 of 26) http://example.com/themes/zenmobile/plugins/img/blueButton.png 
Application Cache Progress event (26 of 26) 
Application Cache Cached event 

Quand j'actualisez la page à nouveau toutes les images/css/js ne parviennent pas à charger et journal de la console vomit:

Document was loaded from Application Cache with manifest http://example.com/themes/zenmobile/cache.manifest 
Application Cache Checking event 
Application Cache NoUpdate event 

Puis une charge de « chargement a échoué ressources »

Autre que cette sortie, je ne l'ai pas trouvé quelque chose d'utile pour essayer de résoudre ce problème. Quelqu'un a-t-il déjà vu cela avant?

Answer 1

Les manifestes html5 sont difficiles à traiter. Si cela fonctionne dans un navigateur, il peut ne pas fonctionner dans un autre

1) Regardez dans votre onglet ressources pour voir quelle ressource est à l'origine de l'erreur (en utilisant Firebug ou webkit)
2) J'ai trouvé que changer le nom manifeste avec Chaque déploiement permet de s'assurer que les navigateurs détectent un changement.

Answer 2

Chargez-vous d'autres ressources qui ne figurent pas dans votre fichier manifeste? Essayez de tous les énumérer et de voir si vous continuez à avoir le problème.

Answer 3

Avait le même problème. Mettre cela au fond fixe pour moi:

NETWORK: 
* 

Et pour contourner les problèmes la plupart des gens ont avec les mises à jour manifestes, cette approche fonctionne vraiment bien pour moi:

Apposer le fichier manifeste et tous les mises en cache ressources avec un numéro de version dans l'URL, et également définir le contenu du manifeste pour référencer ce numéro de version. Comme si:

<html manifest="path/to/cache.manifest?v=42"> 

et

CACHE MANIFEST 
#rev ?v=42 

/css/foo.css?v=42 
/css/bar.css?v=42 
/js/script.js?v=42 

J'automatisé ce pour nous, donc avec une nouvelle Déployez-je soulever le nombre de 1 (quelque part dans un fichier de paramètres que je lis) et il est affecté dans tous les fichiers mentionnés. Chaque demande de navigateur détectera non seulement la modification du fichier manifeste, mais provoquera également le rechargement (et le cache) de chaque ressource mentionnée, mettant ainsi à jour l'ensemble de l'application.