validacion - validar formulario javascript antes de enviar
Diseño de sincronización de datos en línea/fuera de línea(Javascript) (9)
Actualmente estoy en el proceso de escribir una aplicación web sin conexión usando todos los recursos html5 para soporte fuera de línea. Sin embargo, ahora estoy empezando a pensar en escribir el módulo de sincronización que garantizará que todos los datos fuera de línea se envíen al servidor y los datos del servidor al cliente. Ahora estoy seguro de que esto ya se ha hecho antes, quiero decir que es un problema de diseño bastante clásico que afecta a los dispositivos móviles y una plétora de otras cosas. Entonces me pregunto si alguien me puede indicar algunos buenos recursos de diseño para este tipo de cosas.
Ahora realmente no necesito ser demasiado sofisticado con esto, quiero decir que no estoy manejando múltiples usuarios accediendo a los mismos datos y estoy feliz de no fusionar conflictos (solo tomar el último) pero aún así me gustaría un diseño que lo haga permítanme esas opciones en el futuro.
Además, ¿hay algún proyecto de código abierto que implemente este tipo de cosas? No estoy por encima de robar el código de otra persona (si la licencia lo permite) y estoy feliz de portarlo.
Actualmente estoy trabajando en una aplicación web similar. He decidido hacer ese flujo de trabajo:
- El formulario realmente no se envía: el botón "Enviar" realmente guarda datos de formularios serializados en localStorage (en algunas filas). Esto ahorra problemas con la captura de envío y la escritura de código de procesamiento de error adicional para manejar la desconexión durante el envío del formulario.
- La secuencia de comandos de transporte se activa después de guardar datos. Comprueba el estado en línea / fuera de línea.
- Cuando está en línea, intenta enviar los datos más recientes de la cola al servidor (solicitud AJAX), y los elimina de la cola en caso de éxito (y continúa enviando los próximos datos de la cola luego de un corto tiempo de espera).
- Se supervisa nuevamente después de un período de tiempo (por setTimeout ()).
DerbyJS fue probablemente la mejor solución. Sin embargo, Derby todavía está en desarrollo y el soporte fuera de línea solo está en planificación y aún no se ha implementado. En el Grupo de Google ( http://groups.google.com/group/derbyjs/browse_thread/thread/7e7f4d6d005c219c ) puede encontrar información adicional sobre lo que se planea en el futuro.
Echa un vistazo a Derby, un framework Node MVC que tiene algunas características de sincronización y resolución de conflictos bastante dulces. http://derbyjs.com/
Me enfrenté al mismo problema y terminé usando un archivo XML para almacenamiento y git para rastrear cambios y enviarlos automáticamente, tan pronto como haya una conexión disponible. La sincronización se realiza con los comandos git commit / push / pull habituales en un script de shell y un cronjob que inicia el script. Esto también funcionaría si almacena JSON en un archivo de texto.
Mi plan para un diseño similar (aún no probado) es utilizar algo como PouchDB para almacenar los datos localmente y luego sincronizarlos con una instancia de sofá remoto.
Personalmente, te recomiendo que escribas un contenedor en la parte superior de la API IndexedDB que verifica si estás en línea / fuera de línea.
- si está fuera de línea, simplemente almacene en indexedDB y establezca el indicador persistente en falso en todos los documentos
- si está en línea, obtenga todos los documentos donde persistió es falso y guárdelos en mongodb o algo equivalente en el backend, luego almacene documentos nuevos en indexedDD y en el servidor con el indicador persistente en verdadero.
Tendría que aumentar el túnel para establecer el indicador persistente automáticamente y también tunelizar la sincronización de estos documentos al backend
Si está dispuesto a usar el framework Ext JS / Sencha potencialmente pesado, tiene una buena API de datos con soporte fuera de línea (por ej. LocalStorage) y un enfoque de proxy para escribir a través del servidor local. Yo uso Sencha Touch (móvil específico).
Para la depuración de almacenamiento web, echa un vistazo a Weinre.
Tuve un problema similar. Decidí usar un enfoque puramente JSON de entrada y salida. La solución que estoy tomando en el envío de formularios es:
- atrapar el formulario enviar evento
- comprobar si el usuario está conectado o no
- si el usuario está en línea , envíe el formulario como forma normal POST
- si el usuario está fuera de línea , agregue una solicitud JSON y almacénela localmente (decidí usar la base de datos Web SQL). La tabla de espera es simplemente Uri y Payload.
Luego tengo ganchos de eventos globales para los eventos en línea / fuera de línea. Cuando el usuario vuelve a estar en línea, comprueba la cola y, si la cola tiene elementos, los envía a través de las solicitudes JSON POST.
Si está interesado principalmente en obtener datos JSON y almacenarlos en caché para su uso sin conexión, eche un vistazo a jquery.offline .
El desafío con la sincronización en ambas direcciones es que necesita actualizar las listas locales en caché con cualquier trabajo CRUD que haya puesto en cola.
Me gustaría encontrar una forma más genérica para hacer esto.
en nuestro equipo ya hemos desarrollado la aplicación en modo fuera de línea / en línea.
estamos usando las siguientes bibliotecas siguientes:
Usando rack-offline estamos almacenando en caché todos los archivos de recursos y la plantilla jst para mostrar contenido en la página. backbonejs y backbonejs-localStorage ayuda a hacer la aplicación MVC en el cliente. es bastante increíble, deberías probarlo. siempre estamos usando localstorage para guardar datos. cuando creamos una publicación, por ejemplo, un objeto de modelo y guardamos en localStorage, estamos activando colas para la sincronización (también lo tenemos por temporizador de fondo de trabajo para el proceso de sincronización automático). Para cada modelo, tenemos una clase de sincronización separada que debe ejecutarse mediante el activador de sincronización de cola. si su navigator.onLine => true enviamos solicitudes al servidor con datos para actualizar. si cierra el navegador, de todos modos no perderá sus datos porque tiene colas en el Almacén local. la próxima vez que el cliente sincronice datos en la primera carga con navigator.onLine => true.
Cómo utilizar el rack-fuera de línea puede verificar mi pequeño proyecto en el github:
¡Buena suerte!