Conception de la synchronisation des données en ligne et hors ligne (Javascript)

Question

Je suis actuellement en train d'écrire une application web hors ligne en utilisant toutes les fonctionnalités html5 pour le support hors ligne. Cependant, je commence maintenant à penser à écrire le module de synchronisation qui garantira que toutes les données hors ligne sont envoyées au serveur et que les données du serveur sont renvoyées au client. Je suis sûr que cela a déjà été fait, je veux dire que c'est un problème de conception assez classique qui affecte les appareils mobiles et une pléthore d'autres choses. Je me demande donc si quelqu'un peut m'indiquer de bonnes ressources de conception pour ce genre de choses ?

Je n'ai pas besoin d'être trop sophistiqué, je n'ai pas besoin de gérer plusieurs utilisateurs accédant aux mêmes données et je suis content de ne pas fusionner les conflits (juste prendre le dernier) mais j'aimerais quand même une conception qui me permette ces options à l'avenir.

Par ailleurs, existe-t-il des projets open source mettant en œuvre ce type de choses ? Je n'ai pas peur de copier le code de quelqu'un d'autre (si la licence le permet) et je suis heureux de faire du portage.

Answer 1

J'ai eu un problème similaire. J'ai décidé d'utiliser une approche purement JSON en entrée et en sortie. La solution que j'adopte pour la soumission de formulaire est la suivante :

1. attraper l'événement de soumission du formulaire
2. vérifier si l'utilisateur est en ligne ou non
3. si l'utilisateur est en ligne puis soumettre le formulaire comme un formulaire normal POST
4. si l'utilisateur est hors ligne puis stringifier une requête JSON et la stocker localement (j'ai décidé d'utiliser une base de données Web SQL). La table de la file d'attente est simplement Uri et Payload.

Ensuite, j'ai des crochets d'événements globaux pour les événements en ligne/hors ligne. Lorsque l'utilisateur revient en ligne, il vérifie la file d'attente et, si celle-ci contient des éléments, il les envoie sous forme de requêtes JSON POST.

Si vous êtes principalement intéressé par obtenir JSON et de les mettre en cache pour une utilisation hors ligne, alors jetez un coup d'oeil à jquery.offline .

Le problème de la synchronisation dans les deux sens est que vous devez mettre à jour les listes locales en cache avec tout travail CRUD que vous avez mis en file d'attente.

J'aimerais trouver un moyen plus générique de le faire.

Answer 2

Mon plan pour un design similaire (pas encore essayé) est d'utiliser quelque chose comme PouchDB pour stocker les données localement, puis les synchroniser avec une instance de canapé distante.

Answer 3

Jetez un coup d'œil à Derby, un framework Node MVC qui possède des fonctionnalités de synchronisation et de résolution de conflits plutôt intéressantes. http://derbyjs.com/

Answer 4

Dans notre équipe, nous avons déjà développé des applications en mode offline/online.

nous utilisons les bibliothèques suivantes :

• rack-offline
• jquery
• backbonejs
• backbonejs-localStorage
• backbonejs-queues
• jammit

En utilisant rack-offline, nous mettons en cache tous les fichiers de ressources et le modèle jst pour le rendu du contenu sur la page. backbonejs et backbonejs-localStorage permettent de créer une application MVC sur le client. c'est assez génial, vous devriez l'essayer. nous utilisons toujours localstorage pour sauvegarder les données. lorsque nous créons un post, par exemple un objet modèle, et que nous l'enregistrons dans localStorage, nous déclenchons des files d'attente pour la synchronisation (nous avons également un travailleur de fond qui s'exécute automatiquement pour le processus de synchronisation). Pour chaque modèle, nous avons une classe de synchronisation séparée qui doit être exécutée par le déclencheur de synchronisation de file d'attente. Si votre navigateur.onLine => true, nous envoyons des requêtes au serveur avec les données à mettre à jour. Si vous fermez le navigateur, vous ne perdez pas vos données parce que vous avez des files d'attente dans le localStorage. La prochaine fois, le client synchronisera les données au premier chargement avec navigator.onLine => true.

Comment utiliser rack-offline, vous pouvez consulter mon petit projet dans le github :

pomodoro-app

Bonne chance !

Answer 5

J'ai été confronté au même problème et j'ai fini par utiliser un fichier XML pour le stockage et git pour suivre les modifications et les commiter automatiquement, dès qu'une connexion est disponible. La synchronisation est faite avec les commandes habituelles de git commit / push / pull dans un shell script et un cronjob démarrant le script. Cela fonctionnerait également si vous stockez JSON dans un fichier texte.