¿Es posible la aplicación de modo sin conexión en un navegador (HTML5)?

Question

¿Es posible construir una aplicación dentro de en el navegador? Una aplicación significa:

1 Donde hay conexión (modo en línea) entre el navegador y un servidor de aplicaciones remoto:

• la aplicación se ejecuta en el modo basado en la web típica
• las tiendas de aplicaciones necesario datos en el almacenamiento fuera de línea, para ser utilizado en modo fuera de línea (2)
• la aplicación sincronización/datos push (capturados durante el modo fuera de línea) de vuelta al servidor cuando se reanuda del modo fuera de línea al modo en línea

2 Donde hay ninguna conexión (modo sin conexión) entre el navegador y un servidor de aplicaciones remoto: (? Javascript)

• la aplicación seguirá funcionando
• la aplicación presentará los datos (que se almacena fuera de línea) al usuario
• la aplicación puede aceptar la entrada del usuario (y almacenar/agregar en el almacenamiento fuera de línea)

¿Esto es posible? Si la respuesta es sí, ¿se está construyendo algún marco (Ruby/Python/PHP)?

Gracias

Answer 1

Sí, eso es posible.

• tiene que escribir la aplicación en Javascript, y detectar alguna manera si el navegador está en modo fuera de línea (más sencillo es sondear un servidor de vez en cuando). (Editar: vea los comentarios para una mejor manera de detectar el modo fuera de línea)

• Asegúrese de que su aplicación consiste únicamente en archivos HTML, Js y CSS estáticos (o configure la política de almacenamiento en caché manualmente en su script para que su navegador lo recuerde ellos en modo fuera de línea). Las actualizaciones de la página se realiza a través de la manipulación DOM JS, no a través del servidor (un marco como ExtJS http://www.extjs.com le ayudará aquí)

• Para el almacenamiento, utilice un módulo como PersistJS (http://github.com/jeremydurham/persist-js), que utiliza el almacenamiento local del navegador para realizar un seguimiento de los datos. Cuando se restaura la conexión, sincronícela con el servidor.

• Necesita precachear imágenes y otros activos utilizados, de lo contrario no estarán disponibles en modo fuera de línea si no los utilizó antes.

• De nuevo: la mayor parte de su aplicación debe estar en javascript, un framework de PHP/Ruby/Python le ayudará poco si el servidor no está disponible. El servidor probablemente se mantenga lo más simple posible, una API AJAX similar a REST para almacenar y cargar datos.

Answer 2

Aquí hay un hacks.mozilla.org artículo con una demo: http://hacks.mozilla.org/2010/01/offline-web-applications/

Another demo.

documentación más detallada: https://developer.mozilla.org/en/HTML/HTML5#Web_application_features

Answer 3

Tener un vistazo a Google Gears, http://code.google.com/apis/gears/. A pesar de que han sido eliminados a favor de HTML5. Sin embargo, parece que lo que se está promocionando como HTML5 es Google Gears.

Answer 4

Yo estaba buscando esto también, descubrí abt HTML5 Offline Web Apps. no lo he intentado aunque

Los usuarios de aplicaciones web en línea típicas solo pueden usar las aplicaciones mientras tienen conexión a Internet. Cuando se desconectan, ya no pueden consultar su correo electrónico, buscar citas en el calendario o preparar presentaciones con sus herramientas en línea. Mientras tanto, las aplicaciones nativas proporcionan esas características: los clientes de correo electrónico almacenan en caché las carpetas localmente, los calendarios almacenan sus eventos localmente, los paquetes de presentación almacenan sus archivos de datos localmente.

Answer 5

El "Let's Take This Offline" chapter en Marcos peregrino del libro (en línea) Dive Into HTML5 es un muy buen resumen de escribir aplicaciones web sin conexión con las tecnologías HTML5.

Nota: Dado que el enlace original de buceo original de Mark Pilgrim parece estar fuera de servicio.

Copias ahora se pueden encontrar here entre otros lugares.

Answer 6

Jake Archibald escribió "El libro de cocina fuera de línea". Un enfoque moderno (9 de diciembre de 2014) y agradable con ServiceWorker:

http://jakearchibald.com/2014/offline-cookbook/

Answer 7

Javascript le dan una opción para el modo fuera de línea y el sitio web llamado UpUp Javascript Framework. Una pequeña secuencia de comandos que asegura que su sitio siempre esté ahí para sus usuarios, incluso cuando están en un avión o 20,000 millas bajo el mar.

<html> 
<head> 
    <meta charset="UTF-8"> 
    <title>Lonely Globe Advisor</title> 
</head> 
<body> 
    <h1>Top Hotels in Rome</h1> 
    <ol> 
    <li>Villa Domus - Via Piacenza 9, Rome, Italy</li> 
    <li>Hotel Trivelli - Piazza Barberini 11, Rome, Italy</li> 
    </ol> 
    <script src="/upup.min.js"></script> 
    <script> 
    UpUp.start({ 
     'content-url': 'offline.html', 
     'assets': ['css/bootstrap.min.css', 'css/offline.css'] 
    }); 
    </script> 
</body> 
</html> 

Ahora el contenido de nuestros usuarios ven cuando están fuera de línea, es el contenido de offline.html. Este es solo un archivo HTML simple, no diferente de cualquier otra página en nuestro sitio.

Nuestro archivo offline.html contiene dos archivos CSS: bootstrap.min.css y offline.css. Asegurémonos de que estén en caché y disponibles para nuestros usuarios cuando están desconectados