使用 WebSockets 的 9 个应用场景(9 killer uses for WebSockets)

By | 2018年7月12日

WebSockets enables instant data exchange and is supported by all modern browsers. Put it to use immediately in your Web apps

To all my readers: Fortunately for me I’m currently in Brazil scaling systems, soaking up 90º F (32.2º C) weather, and having my fill of feijoada and caipirinha. Meanwhile, to keep this blog up to your standards, I’ve enlisted my main man Jonathan Freeman to educate you while I’m away. Without further ado, here’s Jonathan — front-end guru, big data specialist, and jazz musician. Enjoy and see you in a couple weeks! — ACO

Users now demand information as soon as it’s available. If you have to refresh the page to get new information, it’s already too late. Luckily, a protocol supported by all modern browsers allows for direct data exchange: WebSockets.

WebSockets支持及时数据交换,并被所有现代浏览器支持。请直接在你的web apps上使用它吧。

至所有我的读者:幸运的是我目前在巴西进行Scaling systems项目,享受32度的气温,吃着咸八宝饭还有凯匹林纳鸡尾酒。同时根据你们的要求更新着博客,我邀请了我主要的成员侨纳琛弗里曼在我离开的时间指导你们。

No other solution exists that provides true bidirectional communication like WebSockets, yet many Web developers still rely on hacks like AJAX long polling. (For the record, I think long polling is highly creative and functional, but a hack nonetheless.) Lack of enthusiasm for WebSockets may be related to a security vulnerability years ago or the lack of browser support at the time, but both issues have been addressed.

Determining whether to use WebSockets for the job at hand is simple:

  • Does your app involve multiple users communicating with each other?
  • Is your app a window into server-side data that’s constantly changing?

If you answered yes to either of these questions, consider using WebSockets. If you’re still unsure and want some inspiration, here are a few killer use cases.



  • 你的应用提供多个用户相互交流吗?
  • 你的应用是展示服务器端经常变动的数据吗?


1. Social feeds
One of the benefits of social apps is knowing what all your friends are doing when they do it. Sure, it’s a little creepy, but we all love it. You don’t want to wait minutes to find out a family member won a pie-baking contest or a friend has become engaged. You’re online, so your feed should update in real time.

2. Multiplayer games
The Web is quickly coming into its own as a gaming platform. Without having to rely on plug-ins (I’m looking at you, Flash) Web developers are now able to implement and experiment with high-performance gaming in the browser. Whether you’re dealing with DOM elements, CSS animations, HTML5 canvas or you’re experimenting with WebGL, efficient interaction between players is crucial. I don’t want to discover my opponent has moved after I pull the trigger.





3. Collaborative editing/coding
We live in the age of distributed dev teams. Working on a copy of a document used to suffice, but then you had to figure out a way to merge all the edited copies together. Version control systems like Git can help with certain files, but you’ll still have to track people down when Git finds a conflict it can’t deal with. With a collaborative solution like WebSockets, we can work on the same document and skip all the merges. It’s easy to see who is editing what and if you’re working on the same portion of a document as someone else.

4. Clickstream data
Being able to analyze how users interact with your website is critical to improving it. The cost of HTTP has forced us to prioritize and collect only the most important data. Then, six months down the line, we realize we should’ve been collecting a different metric — one that looked unimportant but would now shed light on a critical decision. With the overhead of HTTP requests out of the way, you can be less restrictive about the kind of data you’re sending from the client. Want to track mouse movement in addition to page loads? Just send the data through a WebSocket connection to the back end and persist it in your favorite NoSQL store. (MongoDB is good for logging eventslike this.) Now you can play back customer interactions to see what was really going on.





5. Financial tickers
The finance world moves fast — microsecond fast. Our human brains can’t keep up with processing data at that speed, so we write algorithms to do it for us. Even if you’re not dealing with high-frequency trading, however, stale information can only hurt. When you have a dashboard tracking companies you’re interested in, you want to know what they’re worth now, not 10 seconds ago. Use WebSockets to stream that data and no one needs to wait.

6. Sports updates
While we’re on the topic of silly things people are passionate about, let’s talk sports. I’m not a sports guy, but I know what sports guys want. When the Patriots are playing, my brother-in-law surrenders himself to the pace of the game. It’s a trancelike state prone to violent, visceral reactions. I don’t understand it, but I respect the intensity of the connection, so the last thing I want to do is add latency to his experience. If you’re including sports information in your Web app, WebSockets can keep your users up to speed.





7. Multimedia chat
While there’s no substitute for holding a meeting in person, videoconferences are about as good as it gets when we can’t get everybody in the same room. The videoconference route is plug-in heavy, though, and full of proprietary "goodness." I’m a fan of the open Web, so using WebSockets with getUserMedia API’s and the HTML5 audio and video elements is an obvious win. WebRTC, the logical predecessor to the combination I just outlined, looks promising, but the lack of current browser support eliminates it as a candidate.


视频会议并不能代替和真人相见,但当你不能在同一个屋子里见到你谈话的对象时,视频会议是个不错的选择。尽管视频会议私有化做的“不错”,但其使用还是很繁琐。我可是开放式网络的粉丝,所以用WebSockets getUserMedia API和HTML5音视频元素明显是个不错的选择。WebRTC的出现顺理成章的成为我刚才概括的组合体,它看起来很有希望,但其缺乏目前浏览器的支持,所以就取消了它成为候选人的资格。

8. Location-based apps
More and more developers are leveraging the GPS capabilities of mobile devices to make theirWeb apps location-aware. If you’re tracking user locations over time (such as running an app that tracks your progress along a route), you’ll be collecting fine-grained data. If you want to update a Web dashboard in real time (say, a track coach monitoring the progress of runners) HTTP is going to be unnecessarily bulky. Leverage the TCP connection a WebSocket uses and let that data fly.

9. Online education
School keeps getting more expensive, while the Internet keeps getting faster and cheaper. Online education can be a great way to learn, especially if you can interact with teachers and other students. WebSockets is the natural choice, allowing for multimedia chat, text chat, and other perks like collaborative drawing on a digital communal chalkboard…


越来越多的开发者借用移动设备的GPS功能来实现他们基于位置的网络应用。如果你一直记录用户的位置(比如运行应用来记录运动轨迹),你可以收集到更加细致化的数据。如果你想实时的更新网络数据仪表盘(可以说是一个监视运动员的教练),HTTP协议显得有些笨拙。借用WebSocket TCP链接可以让数据飞起来。





电子邮件地址不会被公开。 必填项已用*标注