如何进行类似Google Docs的实时更新?

发布于 2024-09-19 12:05:40 字数 385 浏览 6 评论 0原文

我想做一些与 Google Doc 的实时更新非常类似的事情 - 所有用户都可以“立即”看到文档中其他用户的操作。

为了实现这一点,到目前为止我的想法是:

  • 在后台完成连续的 AJAX 请求(这似乎是性能密集型的)?
  • 服务器肯定没有办法将通知推送到所有客户端并相应地更新它们吗?
  • AJAX 每隔 X 秒请求一次缓冲/延时动作,以便在这 X 秒内完成(模拟实时效果)?

我想了解其他人尝试实现此效果的经验。最好的方法是什么?

感谢所有帮助。

注意:我并不是专门寻找实时文档编辑解决方案。我正在寻找与谷歌对其文档所做的相同概念的解决方案。实际上,我将以稍微不同的方式使用该解决方案。

I want to do something very similar to Google Doc's live updating - where all users can "immediately" see the actions of the other users in the doc.

To achieve this, my ideas so far:

  • Continuous AJAX requests being done in the background (this would seem performance-intensive)?
  • Surely there's not a way for the server to push notifications to all its clients and update them accordingly?
  • AJAX requests every X seconds with a buffer/time-lapse of actions to be accomplished in those X seconds (simulating a real-time effect)?

I would like to know others experience in trying to achieve this effect. What is the best way to do this?

All help is appreciated.

NOTE: I'm not specifically looking for a real-time document editing solution. I'm looking for a solution to the same concept of what Google does with their Docs. I will actually be using that solution in a slightly different manner.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(11

长不大的小祸害 2024-09-26 12:05:45

我建议使用 Comet 框架,例如 Atmosphere。它会自动为您的消息选择一种传输机制,如果幸运的话可以是 websocket(但由于这是抽象的,因此您不必担心)。无论如何,如果您不必处理单独的请求/响应以及您将遇到的所有错误源和浏览器错误,那么它是非常有价值的。我去过那里。那里有龙。 :-)

I recommend using a Comet framework like Atmosphere. It will automatically choose a transport mechanism for your messages, which can be websockets if you're lucky (but as this is abstracted away, you do not have to worry). Anyway it is great value if you do not have to deal with individual requests / responses and all the error sources and browser bugs that you will encounter. I've been there. There be dragons. :-)

思念绕指尖 2024-09-26 12:05:45

Also take a look at pubsubhubbub - http://code.google.com/p/pubsubhubbub/
Watch the video for a short intro.

终弃我 2024-09-26 12:05:45

您还可以查看 ShareJS 操作转换库和 Derby 这是一个基于 sharejs 构建的框架。它们都有 Node.js 后端 - sharejs 是由 Google Wave 工程师编写的。

You could also have a look at ShareJS a Operational Transform libary and Derby which is a framework built on sharejs. They both have node.js backends - sharejs was written by a Google Wave engineer.

横笛休吹塞上声 2024-09-26 12:05:44

限制 ajax 请求数量的一种方法是巧妙地将它们分开。您不需要每秒都发出请求。当您收到活动响应时,请在 1 秒内执行另一个请求。如果没有活动,则 2 秒,然后 4 秒,依此类推,请求之间最多可能有 30 秒。当更新发生时,重置计时器。基本上,以智能的方式间隔您的请求,使 GUI 看起来尽可能响应。

One way to limit the # of ajax requests is to get clever with spacing them out. You don't need to make a request every second. When you get a response with activity, then do another request in 1 second. If no activity, then 2 seconds, then 4, etc, with maximum of maybe 30 seconds in between requests. When updates happen, reset the timer. Basically, space your requests in a smart way to make the GUI look as responsive as possible.

橙味迷妹 2024-09-26 12:05:43

如果您的用户只使用现代浏览器,那么我会尝试 HTML 5 附带的 websocket 标准。
未来会有越来越多的浏览器支持它,谷歌和苹果等公司正在为此努力。
这里有一个入门教程:
http://net.tutsplus.com/tutorials /javascript-ajax/start-using-html5-websockets-today/

If your users are only using modern browsers than i would try out the websocket standard coming with HTML 5.
More and more browser will support it in the future and companies like Google and Apple are working on this.
Here a getting started tutorial:
http://net.tutsplus.com/tutorials/javascript-ajax/start-using-html5-websockets-today/

猫卆 2024-09-26 12:05:43

如果您不想使用 Web Sockets,因为它们没有得到广泛支持,您需要查找 Comet。 Google Docs 可能就是这样做的。

If you don't want to use Web Sockets because they're not widely supported, you'll want to look up Comet. That's how Google Docs probably does it.

蓝颜夕 2024-09-26 12:05:43

如果您正在寻找实时协作富文本编辑器,EtherPad 已开源。

EtherPad has been open-sourced, if you're looking for a realtime collaborative rich text editor.

故事与诗 2024-09-26 12:05:42

Ajax 方法是一种方法。您可以像聊天应用程序一样实现它。实际的方式将取决于正在查看的数据。简而言之,

  1. 创建一个会话。它可以容纳共享文档的用户(例如 Excel 文件)。
  2. 当用户 A 进行更改(例如更新单元格 A5)时,使用 Ajax 将更改发送到服务器。更改可以与到达日期或某些索引值一起存储。
  3. 页面有时会触发后台 Ajax 调用。作为请求的一部分,最后访问日期也会被传递。
  4. 收到请求后,您只需提供自上次或索引以来所做的所有更改即可。您可以将新的日期或索引值作为响应的一部分包含在内,以便可用于下一个请求。
  5. 当您确定顶部 X 元素不会被访问时,您可以删除它们。

它是否会是性能密集型的,很大程度上取决于如何构建所有内容。

您的另一个选择是网络套接字。个人没有使用过它,但如果您可以控制用户将使用的浏览器,您可以尝试一下。它允许服务器将数据推送到浏览器。
一些链接:
Web Sockets JS
Firefox 中的 Web 套接字

A Ajax approach is one way to go. You could implement it like the chat applications. The actual way will depend on the data being view. In short

  1. Create a session. It could house the users sharing the doc (eg excel file)
  2. When user A make a change (eg. update cell A5), use Ajax to send the changes to the server. The change can be stored with the date of arrival or some index value.
  3. A background Ajax call is fired by the page from time to time. As part of the request, the last date of access is passed as well.
  4. Upon receiving the request, you simply serve all the changes made from the last time or index. You could include the new date or index value as part of the response so that it can be use for the next request.
  5. When you are sure that the top X elements will not be access, you could remove them

Whether it will be performance intensive or not will depend largely on how to structure everything.

Your other option is web sockets. Haven't used it personally but if you have control over what browser your users will use, you could give it a shot. It allows the server to push data to the browser.
Some Links:
Web Sockets JS and
Web Sockets in Firefox

不离久伴 2024-09-26 12:05:42

另一种选择是Orbited

Orbited 提供了一个纯粹的
浏览器中的 JavaScript/HTML 套接字。
它是一个网络路由器和防火墙
允许您集成网络
具有任意后端的应用程序
系统。您可以实施任何网络
浏览器中的协议——没有
求助于插件。

Orbited 是一个 HTTP 守护进程
针对持久彗星进行了优化
连接。它的设计目的是
轻松与新的和
现有的应用程序。轨道允许
你写实时网页
应用程序,例如聊天室或
即时通讯客户端,无需
使用任何外部插件,例如 Flash
或Java。

Another alternative is Orbited:

Orbited provides a pure
JavaScript/HTML socket in the browser.
It is a web router and firewall that
allows you to integrate web
applications with arbitrary back-end
systems. You can implement any network
protocol in the browser—without
resorting to plugins.

Orbited is an HTTP daemon that is
optimized for long-lasting comet
connections. It is designed to be
easily integrated with new and
existing applications. Orbited allows
you to write real-time web
applications, such as a chat room or
instant messaging client, without
using any external plugins like Flash
or Java.

岁吢 2024-09-26 12:05:41

我投票支持长轮询策略:每个客户端向服务器打开一个请求,但服务器永远不会断开连接,只是时不时地发送一些java脚本。

持续的 AJAX 请求会杀死您的服务器。

I vote for Long-poll strategy : each client opens a request to the server, but the server never breaks up connections, and just send pieces of java-script from time to time.

Constant AJAX requests would kill your server.

祁梦 2024-09-26 12:05:41

请查看 google mobwrite。它是一个嵌入式库,可通过操作转换来协作编辑 html 表单。

从服务器获取事件推送是很容易的部分,有很多方法可以做到这一点。确保所有客户端的状态一致,这是困难的部分。这就是操作转换算法的用武之地。

2023 年更新:一般来说,社区已转向 CRDT 库以在对等点之间同步数据。 YJSAutomerge 是构建此类内容的流行选择。

Check out google mobwrite. It's a drop-in library that enables collaborative editing of html forms via operational transformation.

Getting events pushed back from the server is the easy part, there are many ways to do it. Ensuring that the state is consistent across all clients, that's the hard part. That's where the operational transformation algorithm comes in.

Update for 2023: generally the community has moved on to CRDT libraries for synchronizing data between peers. YJS and Automerge are popular choices for building something like this.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文