Angular的实时数据


Real time data with Angular

我想创建一个包含数据的网页,这些数据可以实时编辑。

用户可以实时查看数据并进行编辑,就像"谷歌表单"一样,每个人都可以编辑同一个文件并实时查看其他文件的更改。

我将使用PHP,MYSQL,AngularJS。

我想咨询你如何以最好的方式做到这一点,这是我想到的一些要点:

  1. 每X秒使用一次角度轮询来实时更新页面数据,但如果用户编辑其中一个字段,我如何防止该特定字段通过轮询进行更新?

  2. 如何锁定用户正在编辑的特定字段,以防止两个用户在实时中编辑同一字段

  3. 有比角度轮询更好的实时提取数据的方法吗?

  4. 当用户编辑文本字段时,我想在没有"提交"或保存按钮的情况下将其更新到数据库中,我想3秒钟后保存数据,有更好的想法吗?

谢谢你,

1:我建议您在AngularJS控制器中有一个对象数组或类似的数据结构,其中包含字段。当用户开始编辑某个字段时,可以在数据结构中的字段对象中将isEditing设置为true。每当出现更新时,您都会遍历数据结构,只更新isEditing未设置/不为true的字段。

为了使其更实时,设置WebSockets并让服务器在字段更改时向所有编辑器广播字段的最新值,而不是轮询。

2:为了锁定某个用户正在处理的字段,可以向包含字段的数据库表中添加一个locked列。每当用户想要开始编辑时,就会出现以下情况:

  • 用户请求编辑字段
  • 服务器检查字段是否已锁定
  • 如果该字段未锁定,则允许用户编辑该字段,服务器会根据您的需要将locked列设置为true或用户名
  • 如果字段被锁定,则不允许用户编辑字段

当用户在编辑字段后保存字段时,应将locked列设置为false。每当编辑用户断开连接时,您可能还应该将locked列设置为false。

3:PHP本身无法在客户端不发出请求的情况下向客户端发送数据。您需要将WebSocket支持添加到PHP中(例如http://socketo.me/,但还没有尝试过)。

如果你对一个能够开箱即用的服务器平台感兴趣,你可以看看http://nodejs.org.当您计划使用Node.js时,我建议使用http://socket.io/以实现最大的浏览器兼容性。(它包括每当用户浏览器不支持WebSocket时的回退)

4:如果当前值与上次保存的值不同,则可以每隔x保存一次当前值。这将比总是节省价值更有效率。为此,您需要将以前保存的值保存在变量中。