2010-07-19 106 views
49

我目前正在编写一个脱机webapp使用所有html5好东西进行脱机支持。不过,我现在开始考虑编写同步模块,以确保将任何脱机数据发送到服务器和服务器数据返回给客户端。现在我确信这已经完成了,我的意思是它是一个非常经典的设计问题,会影响移动设备和其他许多事情。所以我想知道任何人都可以为我指出一些很好的设计资源吗?离线/在线数据同步设计(Javascript)

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

另外,是否有任何开源项目实现这种类型的东西?我不是在撕掉别人的代码(如果许可证允许的话),我很乐意移植。

回答

8

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

  1. 捕获形式提交事件的用户
  2. 检查是否是网上
  3. 如果用户在线然后提交表单为正常表单POST
  4. if user is offline然后将JSON请求串化并本地存储(我决定使用Web SQL数据库)。队列表就是Uri和Payload。

然后我有在线/离线事件的全局事件挂钩。当用户重新联机时,它会检查队列,如果队列中有项目,则会以JSON POST请求的形式发送它们。

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

双向同步的挑战在于您需要使用任何已排队的CRUD工作来更新本地缓存列表。

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

1

我遇到了同样的问题,并最终使用XML文件存储和git来跟踪更改并自动提交它们,一旦有连接可用。同步是通过shell脚本中的git commit/push/pull命令和启动脚本的cronjob完成的。如果您将JSON存储在文本文件中,这也会起作用。

9

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

+0

哎!你成功了吗?我想听听你的经历。 – Nek 2014-11-24 18:54:59

4

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

我们使用的是下届库:

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

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

pomodoro-app

祝你好运!

1

我目前正在研究类似的web应用程序。我决定做这样的工作流程:

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

如果您正在使用可能很繁重的Ext JS/Sencha框架,它具有一个很好的数据API,支持脱机(例如本地存储)和用于直通到本地然后服务器的代理方法。我使用Sencha Touch(移动专用)。

对于调试Web存储,请查看Weinre。

6

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

+4

Derby使用[RacerJS](https://github.com/codeparty/racer)进行数据同步,所以您不必*去*完整的Derby框架。根据他们自己的说法,RacerJS仍然处于alpha阶段。 – 2012-10-02 11:20:28

2

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

  • 如果离线,只是存储在索引资料和设置持续标志设置为false的所有文件
  • 如果在线,让那里坚持所有文件是假的,并将它们存储在MongoDB中什么equivelant在后端,然后存储新在indexedDB和服务器上的文件夹中,持久标志为true。

I've written a small one

你将不得不增加隧道自动设置持久性标志,也隧道这些文件同步到后端