cache - html5 offline
HTML5 desconectado "Evento de error en la caché de la aplicación: error en la captura del manifiesto(-1)" (7)
Estoy intentando escribir una aplicación fuera de línea de HTML5 pero parece que Chrome no puede aceptar el archivo de manifiesto de caché.
Chrome registra la siguiente salida en su consola mientras carga la aplicación:
Creating Application Cache with manifest http://localhost/cache.manifest
Application Cache Checking event
Application Cache Error event: Manifest fetch failed (-1) http://localhost/cache.manifest
Sin embargo, si elimino todas las líneas del archivo de manifiesto, excepto la primera línea (es decir, "CACHE MANIFEST"), Chrome acepta el manifiesto:
Creating Application Cache with manifest http://localhost/cache.manifest
Application Cache Checking event
Application Cache Downloading event
Application Cache Progress event (0 of 0)
Application Cache Cached event
Pero, tan pronto como agrego una nueva línea al manifiesto (incluso si la siguiente línea está vacía), Chrome vuelve a quejarse de que la recuperación ha fallado.
Todos los archivos se están sirviendo localmente desde una PC con Windows 7 a través de Python utilizando SimpleHTTPServer en el puerto 80. He actualizado el mapa de tipos en% PYTHON% / Lib / mimetypes.py con la siguiente línea:
''.manifest'': ''text/cache-manifest'',
El manifiesto debe contener lo siguiente:
CACHE MANIFEST
scripts/africa.js
scripts/main.js
scripts/offline.js
scripts/libs/raphael-min.js
favicon.ico
apple-touch-icon.png
¿Has probado algo como https://manifest-validator.appspot.com/ para validar tu manifiesto?
He luchado con mi archivo de manifiesto durante bastante tiempo, es muy difícil identificar qué es lo que está mal. Podría ser algo tan simple como una codificación incorrecta para un salto de línea adicional al comienzo.
Acabo de encontrar este enlace:
http://www.kaspertidemann.com/regarding-the-manifest-fetch-failed-error-in-chrome/
Ahora he resuelto este problema cambiando a CherryPy para servir estos archivos :)
Si alguien más se atasca de forma similar pero quiere mantener la parte del servidor simple, el siguiente Python puede ser suficiente para comenzar:
import cherrypy
class SimpleStaticServer:
@cherrypy.expose
def index(self):
return ''<html><body><a href="index.html">Go to the static index page</a></body></html>''
cherrypy.config.update({
# global
''server.socket_host'': ''192.168.0.3'',
''server.socket_port'': 80,
# /static
''tools.staticdir.on'': True,
''tools.staticdir.dir'': "(directory where static files are stored)",
})
cherrypy.quickstart(SimpleStaticServer())
Si desea visitar el "sitio" desde otro dispositivo, deberá usar la dirección IP externa (para mí, esto fue 192.168.0.3). De lo contrario, solo puede usar ''127.0.0.1'' para el valor ''server.socket_host''. Luego dirijo mi navegador a http://192.168.0.3/index.html para obtener mi página de índice estático.
Creo que la linea
CACHE:
falta en el archivo de manifiesto (debe ser la segunda línea, antes de la lista de archivos).
He resuelto este problema en Visual Studio para la aplicación MVC. siga los siguientes pasos:
He creado el archivo .appcache en el bloc de notas y copio el contenido del archivo de manifiesto en él. (no es necesario crear el archivo .Manifest O NO crear la vista Manifest.cshtml. simplemente crear el archivo .appcache en el bloc de notas).
dar referencia como
<html manifest="~/example.appcache">a la vista y el problema se resolverá
Hoy he experimentado exactamente el mismo problema. Después de horas de trabajo, llegué al punto clave: el formato del archivo de manifiesto. En resumen, el archivo debe comenzar una nueva línea SOLAMENTE con ascii (0A), no ascii (0D), o ascii (0D + 0A). Solo de esta manera puedo vivir con Chrome, o obtendré una página en blanco y la información de error en la ventana de la consola.
De acuerdo con w3c, (http://www.w3.org/TR/html5/offline.html), en “5.6.3.2 Escribir manifiestos de caché”, tanto 0A, 0D como 0D + 0A son todos aceptables. Entonces, mi opinión es: Chrome no es compatible con w3c en este punto.
Además, digamos, si myapp.js se va a almacenar en caché, DEBE seguir la misma regla: comienza una nueva línea solo con ascii (0A), o Chrome lanzará la misma información en las ventanas de la consola.
Mi Chrome es 13.0.782.107
Para almacenar en caché un sitio web sin conexión (HTML5), debe especificar todos los archivos necesarios para que se ejecute. En resumen, especifique los componentes principales del sitio necesarios.
Una forma sencilla de crear un manifiesto es en el Bloc de notas.
Nota: CACHE MANIFEST debe ser de primera línea y sus archivos seguirán después de un espacio de línea de la siguiente manera:
CACHE MANIFEST
Scripts/script.js
Content/Site.css
Scripts/jquery-ui-1.8.20.min.js
Scripts/modernizr-2.5.3.js
SESOL.png
Scripts/jquery.formatCurrency-1.4.0.min.js
http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css
http://code.jquery.com/jquery-1.8.2.min.js
http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js
Content/themes/images/icons-18-white.png
Controllers/AccountController
Controllers/HomeController
Models/AccountModels
Account/Login
Home/CheckOut
Nota2: eliminar todos los espacios después de cada línea. Nota: 3 debe seguir el formato exacto FOLDER / File o FOLDER / FOLDER / FILE ect ....
El hecho de que tenga un archivo de manifiesto no significa que se cargará. necesitas agregar lo siguiente a la etiqueta:
<html manifest="~/cache.manifest" type="text/cache-manifest">
No olvide que, después de agregar esto, se almacena en caché la primera vez que se carga la página. Por lo tanto, debe registrar un evento de caché en el evento ''mobileinit''.
$(document).on("mobileinit", function () {
//register event to cache site for offline use
cache = window.applicationCache;
cache.addEventListener(''updateready'', cacheUpdatereadyListener, false);
cache.addEventListener(''error'', cacheErrorListener, false);
function cacheUpdatereadyListener (){
window.applicationCache.update();
window.applicationCache.swapCache();
}
function cacheErrorListener() {
alert(''site not availble offline'')
}
}
Descarga Safari y usa el inspector web para encontrar errores. http://developer.apple.com/library/safari/#documentation/appleapplications/Conceptual/Safari_Developer_Guide/1Introduction/Introduction.html#//apple_ref/doc/uid/TP40007874-CH1-SW1
Consejo: Las herramientas de desarrollo de Chrome "F12" le mostrarán los errores en la carga del manifiesto. Es decir, los archivos que aún necesita agregar.
Espero que esto ayude, cubre todo el proceso. Supongo que si está en esta etapa de desarrollo, es nuevo para agregar esto al inicio móvil:
$.mobile.allowCrossDomainPages = true; // cross domain page loading
$.mobile.phonegapNavigationEnabled = true; //Android enabled mobile
$.mobile.page.prototype.options.domCache = true; //page caching prefech rendering
$.support.touchOverflow = true; //Android enhanced scrolling
$.mobile.touchOverflowEnabled = true; // enhanced scrolling transition availible in iOS 5
Guía para desarrolladores de Safari: https://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariWebContent/Client-SideStorage/Client-SideStorage.html#//apple_ref/doc/uid/TP40002051-CH4-SW4