cache.manifest funciona por primera vez, luego falla

Question

Estoy tratando de agregar html 5 de almacenamiento en caché a una aplicación web, nada demasiado complejo solo images/css/js.

Cuando me carga la página después de editar el archivo de cache.manifest me sale el siguiente depuración en 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 

Cuando actualice la página de nuevo todos los css/images/js no se pueden cargar y la registro de la consola arroja:

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

a continuación, una carga de 'no se pudo cargar los recursos'

Aparte de esta salida no he encontrado nada útil para tratar de solucionar este problema. ¿Alguien ha visto esto antes?

Answer 1

Los manifiestos de html5 son difíciles de tratar. Si funciona en un navegador puede que no funcione en otro

1) Busque en su pestaña de recursos para ver qué recurso está causando el error (usando Firebug o webkit)
2) He encontrado que el cambio de nombre de manifiesto con cada implementación ayuda a garantizar que los navegadores detecten un cambio.

Answer 2

¿Está cargando otros recursos que no están en su archivo de manifiesto? Intente enumerarlos todos y ver si continúa teniendo el problema.

Answer 3

Tenía el mismo problema. Poner esto en la parte inferior fija para mí:

NETWORK: 
* 

Y para evitar los problemas de la mayoría de la gente está teniendo con actualizaciones de manifiesto, este enfoque funciona muy bien para mí:

colocará el archivo de manifiesto y todo lo almacenado en caché recursos con un número de versión en la url, y también establecer el contenido del manifiesto para hacer referencia a ese número de versión. De este modo:

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

y

CACHE MANIFEST 
#rev ?v=42 

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

he automatizado esto para nosotros, así que con un nuevo despliegue acabo de aumentar el número de 1 (en algún lugar de un archivo de configuración que leo) y está afectado en todos los archivos mencionados. Cada solicitud del navegador no solo detectará el cambio del archivo de manifiesto, sino que también hará que se vuelva a cargar (y almacenar en caché) cada recurso mencionado, actualizando así la aplicación completa.