2010-11-20 18 views
5

He escrito una aplicación web básica de administrador de contraseñas para que se ejecute sin conexión en un dispositivo móvil (prueba en un iPod Touch de 4ta generación). He agregado la aplicación a la pantalla de inicio y todo funciona bien mientras el iPod está en línea y puede llegar al servidor. Una vez que pongo el iPod fuera de línea, cuando abro la aplicación del siguiente cuadro de diálogo aparece:No se puede obtener una aplicación web para trabajar sin conexión en el iPod

No se puede PwdThing abierto

PwdThing No se puede abrir porque no está conectado a Internet

el archivo HTML estático único para la aplicación (passwordthing.html) apunta al archivo de manifiesto:

<html manifest="cache.manifest"> 
... 

la cache.manifest archivo incluye todos los archivos utilizados por la aplicación (incluyendo los archivos jQuery Mobile):

CACHE MANIFEST 
passwordthing.html 
passwordthing.js 
... 

y el archivo cache.manifest está configurado para ser servido como text/cache-manifest en el archivo .htaccess:

AddType text/cache-manifest .manifest 

Todo el los archivos fuente están en Github (this commit es la versión en el momento de la escritura) y he configurado un public server para instalarlo también.

¿Por qué no puedo hacer que mi aplicación funcione sin conexión?

+2

debe señalar chrome en su aplicación para ver si está recibiendo errores de almacenamiento en caché. – hvgotcodes

+0

@hvgotcodes Acabo de encontrar el error de almacenamiento en caché (nombre de archivo incorrecto), si puede agregar una nueva respuesta según su comentario, lo aceptaré :-) –

+0

hecho - aún puede querer cambiar siempre su nombre de manifiesto con cada lanzamiento. De lo contrario, un archivo puede cambiar, pero el nombre permanece igual y no se actualizará. – hvgotcodes

Respuesta

2

Lo único que puedo pensar es que no ha cambiado el archivo, y Mobile Safari ha almacenado en caché una versión anterior del manifiesto. agrega un comentario a tu manifiesto También puede intentar cambiar el nombre del archivo de manifiesto; Tuve que hacer eso para poner mi IPad en caché: cada vez que actualizo mi aplicación, cambio el nombre del manifiesto para incluir la fecha.

Tenga en cuenta que iOS4.2 tiene mucho mejor soporte de manifiesto. Es posible que vea que las cosas mejoran cuando está fuera.

Editar - O, como resulta, es solo un nombre de archivo incorrecto. ;) (ver comentarios sobre la pregunta)

+0

Gracias, intenté cambiar el nombre del archivo de manifiesto pero no hubo diferencia :-( –

+0

@ben ¿Intentó cargar su aplicación en Chrome y mirar la consola? – hvgotcodes

1

[[replican my answer from here a continuación, ya que puede aplicar aquí para:]]

he encontrado depuración de aplicaciones HTML5 fuera de línea para ser un dolor. He encontrado el código de este artículo me ayudó a entender lo que estaba mal con mi aplicación:

http://jonathanstark.com/blog/2009/09/27/debugging-html-5-offline-application-cache/

depuración HTML 5 Desconectado memoria caché de aplicaciones por Jonathan Stark

Si usted está buscando para proporcionar desconectado acceso a su aplicación web, el caché de aplicaciones sin conexión disponible en HTML5 es devastador. Sin embargo, es un PITA gigante para depurar, especialmente si todavía estás tratando de entenderlo.

Si tiene dificultades con el manifiesto de caché, agregue el siguiente JavaScript a su página HTML principal y visualice la salida en la consola usando Firebug en Firefox o Debug> Show Error Console en Safari.

Si tiene alguna pregunta, PLMK en los comentarios.

HTH,
j

var cacheStatusValues = []; 
cacheStatusValues[0] = 'uncached'; 
cacheStatusValues[1] = 'idle'; 
cacheStatusValues[2] = 'checking'; 
cacheStatusValues[3] = 'downloading'; 
cacheStatusValues[4] = 'updateready'; 
cacheStatusValues[5] = 'obsolete'; 

var cache = window.applicationCache; 
cache.addEventListener('cached', logEvent, false); 
cache.addEventListener('checking', logEvent, false); 
cache.addEventListener('downloading', logEvent, false); 
cache.addEventListener('error', logEvent, false); 
cache.addEventListener('noupdate', logEvent, false); 
cache.addEventListener('obsolete', logEvent, false); 
cache.addEventListener('progress', logEvent, false); 
cache.addEventListener('updateready', logEvent, false); 

function logEvent(e) { 
    var online, status, type, message; 
    online = (navigator.onLine) ? 'yes' : 'no'; 
    status = cacheStatusValues[cache.status]; 
    type = e.type; 
    message = 'online: ' + online; 
    message+= ', event: ' + type; 
    message+= ', status: ' + status; 
    if (type == 'error' && navigator.onLine) { 
     message+= ' (prolly a syntax error in manifest)'; 
    } 
    console.log(message); 
} 

window.applicationCache.addEventListener(
    'updateready', 
    function(){ 
     window.applicationCache.swapCache(); 
     console.log('swap cache has been called'); 
    }, 
    false 
); 

setInterval(function(){cache.update()}, 10000); 
0

También, asegúrese de que el cache.manifest tiene la lista de materiales correcta (en mi caso UTF-8) que coincide con su en el archivo HTML. Si solo tiene un archivo ASCII que no es BOM y el Tipo de contenido está configurado en UTF-8, el almacenamiento en caché fallará

HTH alguien.

Christine Boersen

Cuestiones relacionadas