如何进行类似Google Docs的实时更新?
我想做一些与 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 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(11)
我建议使用 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. :-)
另请查看 pubsubhubbub - http://code.google.com/p/pubsubhubbub/
观看视频了解简短的介绍。
Also take a look at pubsubhubbub - http://code.google.com/p/pubsubhubbub/
Watch the video for a short intro.
您还可以查看 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.
限制 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.
如果您的用户只使用现代浏览器,那么我会尝试 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/
如果您不想使用 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.
如果您正在寻找实时协作富文本编辑器,EtherPad 已开源。
EtherPad has been open-sourced, if you're looking for a realtime collaborative rich text editor.
Ajax 方法是一种方法。您可以像聊天应用程序一样实现它。实际的方式将取决于正在查看的数据。简而言之,
它是否会是性能密集型的,很大程度上取决于如何构建所有内容。
您的另一个选择是网络套接字。个人没有使用过它,但如果您可以控制用户将使用的浏览器,您可以尝试一下。它允许服务器将数据推送到浏览器。
一些链接:
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
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
另一种选择是Orbited:
Another alternative is Orbited:
我投票支持长轮询策略:每个客户端向服务器打开一个请求,但服务器永远不会断开连接,只是时不时地发送一些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.
请查看 google mobwrite。它是一个嵌入式库,可通过操作转换来协作编辑 html 表单。
从服务器获取事件推送是很容易的部分,有很多方法可以做到这一点。确保所有客户端的状态一致,这是困难的部分。这就是操作转换算法的用武之地。
2023 年更新:一般来说,社区已转向 CRDT 库以在对等点之间同步数据。 YJS 和 Automerge 是构建此类内容的流行选择。
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.