离线/在线数据同步设计(Javascript)

时间:2010-07-19 21:44:37

标签: javascript offline data-synchronization pouchdb

我目前正在使用所有html5好东西编写离线网络应用程序以获得离线支持。但是,我现在开始考虑编写同步模块,以确保将任何脱机数据发送到服务器并将服务器数据发送回客户端。现在我确信这已经完成了,我的意思是它是一个非常经典的设计问题,影响移动设备和其他许多东西。所以我想知道有人能指出我为这种事情提供一些好的设计资源吗?

现在我真的不需要过于复杂,我的意思是我没有处理访问相同数据的多个用户,我很高兴不合并冲突(只需要采取最新的),但我仍然希望设计,将来允许我这些选择。

此外,是否有任何开源项目实现此类事情?我不会扯掉其他人的代码(如果许可证允许的话),我很乐意移植。

9 个答案:

答案 0 :(得分:10)

我对类似设计(尚未尝试过)的计划是使用PouchDB之类的东西在本地存储数据,然后将其与远程沙发实例同步。

答案 1 :(得分:9)

我有类似的问题。我决定使用纯粹的JSON进出方法。我正在提交表单的解决方案是:

  1. 抓住表单提交事件
  2. 检查用户是否在线
  3. 如果用户在线,则以正常格式POST
  4. 提交表单
  5. 如果用户离线,则将JSON请求字符串化并将其存储在本地(我决定使用Web SQL数据库)。队列表只是Uri和Payload。
  6. 然后我有在线/离线事件的全局事件挂钩。当用户重新联机时,它会检查队列,如果队列中有项目,则会将其作为JSON POST请求发送。

    如果您主要对获取 JSON数据感兴趣并将其缓存以供离线使用,请查看jquery.offline

    同时进行同步的挑战是您需要使用已排队的任何CRUD工作更新本地缓存列表。

    我想找到一种更通用的方法来做到这一点。

答案 2 :(得分:6)

查看Derby,一个Node MVC框架,它具有一些非常甜蜜的同步和冲突解决功能。 http://derbyjs.com/

答案 3 :(得分:4)

在我们的团队中,我们已经在离线/在线模式下开发了应用程序。

我们正在使用以下以下的库:

使用机架离线我们正在缓存所有资源文件和jst模板以在页面上呈现内容。 backbonejs和backbonejs-localStorage有助于在客户端上创建MVC应用程序。它非常棒,你应该尝试一下。我们总是使用localstorage来保存数据。当我们创建post例如模型对象并保存到localStorage时,我们正在触发队列进行同步(我们也有定时器后台工作程序用于自动运行同步过程)。对于每个模型,我们都有单独的同步类,应该由队列同步触发器运行。如果你的navigator.onLine =>是的,我们正在向服务器发送包含更新数据的请求。如果您关闭浏览器,无论如何您都不会丢失数据,因为您在localStorage中有队列。在下次客户端将使用navigator.onLine =>同步第一次加载时的数据真。

如何使用机架离线,您可以在github中查看我的小项目:

pomodoro-app

祝你好运!

答案 4 :(得分:1)

我遇到了同样的问题,最后使用XML文件进行存储,git跟踪更改并在连接可用时自动提交。使用shell脚本中的常用git commit / push / pull命令和启动脚本的cronjob完成同步。如果将JSON存储在文本文件中,这也可以。

答案 5 :(得分:1)

我目前正在开发类似的webapp。我决定做这样的工作流程:

  1. 表单未真正提交 - “提交”按钮实际上将序列化表单数据保存到localStorage(在某个队列中)。这节省了提交捕获和编写其他错误处理代码以在表单提交期间处理断开连接的麻烦。
  2. 数据保存后触发传输脚本。它检查在线/离线状态。
  3. 在线时,它会尝试从队列发送最新数据到服务器(AJAX请求),并在成功时将其从队列中删除(并在短暂超时后继续从队列中发送下一个数据)。
  4. 在一段时间后(通过setTimeout())重新检查。

答案 6 :(得分:1)

如果您准备使用可能很重的Ext JS / Sencha框架,它有一个很好的数据API,具有离线(例如localStorage)支持和写入本地服务器的代理方法。我使用Sencha Touch(特定于移动设备)。

有关调试网络存储的信息,请查看Weinre。

答案 7 :(得分:1)

DerbyJS可能是最好的解决方案。然而,Derby仍在开发中,离线支持仅在规划中,尚未实施。在Google群组(http://groups.google.com/group/derbyjs/browse_thread/thread/7e7f4d6d005c219c)中,您可以找到有关未来计划内容的附加信息。

答案 8 :(得分:1)

我个人建议您在indexedDB API上编写一个包装器,检查您是否在线/离线。

  • 如果离线,只需存储在indexedDB中并在所有文档上将持久标志设置为false
  • 如果在线,获取持久化的所有文档都是假的,并将它们存储在mongodb或后端的equivelant中,然后将新文档存储在indexedDB和服务器上,并将持久标志设置为true。

I've written a small one

您必须扩充隧道以自动设置持久标志,并将这些文档的同步隧道传输到后端