2011-07-16 15 views
15

Necesito una forma de almacenar imágenes en caché y archivos html en PhoneGap desde mi sitio. Estoy planeando que los usuarios vean el sitio sin conexión a Internet como lo hará con él. Pero veo información solo sobre el almacenamiento de datos sql, pero ¿cómo puedo almacenar imágenes (y usarlas más adelante).Cómo almacenar imágenes en caché y archivos html en PhoneGap

+0

echar un vistazo a esta pregunta: http: // stackoverflow.com/questions/3625640/download-images-and-save-local-on-iphone-phonegap-app –

Respuesta

9

Almacenar en caché como lo necesite para una operación fuera de línea simple no es exactamente así de fácil.

Su primera opción es cache manifest. Tiene algunas limitaciones (como el tamaño de la memoria caché) pero podría funcionar para usted, ya que fue diseñado para hacer lo que desea.

Otra opción es que puede almacenar contenido en el disco del dispositivo utilizando las API del sistema de archivos. Esto tiene algunos inconvenientes como la seguridad y el hecho de que tiene que cargar el archivo desde una ruta de acceso/url que es diferente de lo que normalmente podría cargar desde la web. Consulte el complemento hydra para ver un ejemplo de esto.

Una última opción podría ser almacenar cosas en localStorage (que tiene la ventaja de ser privado en todas las plataformas) y luego sacarlo de allí cuando sea necesario ... eso significa que todas las imágenes se basarán en una gran diferencia con el almacenamiento en caché estándar.

+0

Tenga en cuenta que ahora se desaconseja utilizar el almacenamiento en caché de aplicaciones (manifiesto) según Mozilla: https: //developer.mozilla .org/es-ES/docs/Web/HTML/Using_the_application_cache –

23

Para almacenar en caché las imágenes, consulte esta biblioteca, de la cual soy el creador: imgcache.js . Está diseñado con el único propósito de almacenar imágenes en caché utilizando el sistema de archivos local. Si revisa los ejemplos, verá que también puede detectar cuándo una imagen no se carga (porque está fuera de línea o si tiene una conexión muy mala) y luego la reemplaza automáticamente con la imagen en caché. El usuario de la aplicación web ni siquiera se da cuenta de que está fuera de línea.

En cuanto a las páginas html ... si son archivos estáticos html, podrían almacenarse localmente en la aplicación web (archivo: // en phonegap). Si son páginas generadas dinámicamente, compruebe la API localStorage si tiene una cantidad pequeña de datos, de lo contrario, la API del sistema de archivos.

Para mi aplicación web, recupero solo los datos json de mi servidor (y los proceso/renderizo usando Backbone + subrayado). La carga útil json se almacena en el Almacén local. Si la aplicación se desconecta, obtendrá datos json de localStorage en lugar del servidor (horquilla casera de Backbone.dualStorage)

Luego obtendrá la experiencia completa sin conexión: páginas + imágenes.

+1

Lo utilicé con la versión más reciente de Phonegap (2.2.0) y ¡funcionó! – Max

+0

estoy usando imgcache.js. mientras almacena en caché el archivo de imagen, guarda el icono.png con un nombre diferente como 7678dkld9dio.png. ¿Me falta algo? Cambia el nombre del archivo de imagen. eg :) shell @ android:/storage/sdcard0/ws $ ls Energy.png shell @ android:/storage/sdcard0/ws $ cd .. shell @ android:/storage/sdcard0 $ cd imgcache/ shell @ android:/storage/sdcard0/imgcache $ ls – yokks

+1

Eso es correcto y lo es por diseño. El propósito de esto es evitar un choque de nombres: puede tener dos imágenes diferentes con el mismo nombre de archivo pero una url diferente a la memoria caché, si los archivos no fueron renombrados con un nombre de archivo único en caché (todos están almacenados en la misma carpeta) solo una de las dos imágenes se guardaría, reemplazando a la otra. – chrisben

1

El almacenamiento en caché es muy posible en el sistema operativo Android. pero en Apple como se mencionó anteriormente hay limitaciones con el tamaño de las imágenes y el tamaño de la caché, etc.

Si está dispuesto a integrar y permitir el almacenamiento en caché en iOS, puede usar "cache manifest" para hacerlo. pero ten en mente las desventajas y las limitaciones. También si desea guardar el archivo en la carpeta Documentos en mi aplicación, Apple rechazará su aplicación. El motivo es que el sistema realiza una copia de seguridad de todos los datos en la carpeta Documentos en iCould después de iOS6, por lo que Apple no permite big data como imágenes o archivos JSON que podrían volver a sincronizarse desde su servidor para mantenerse en esta carpeta.

Así que hay otro trabajo que es bueno Entonces uno puede usar LocalFileSystem.TEMPORARY en su lugar. No guarda los datos en Library/Cache, pero guarda los datos en la carpeta temporal de la aplicación, que no es una copia de seguridad automática en iCloud y tampoco se borra automáticamente.

Saludos Rajeev

+0

¡Interesante .....! –

Cuestiones relacionadas