前端开发中，构建实时 Web 应用程序是常常需要面临的问题。要实现实时功能，我们需要一个服务端以及前端可以有效地与服务端相互通信。RESTful web 服务和 SSE（Server-Sent Events）则是两种实现实时功能的主要方式。然而，它们在实现实时功能时有着不同的优缺点。本篇文章将介绍 RESTful web 服务与 SSE 的不同之处，以及如何为您的应用程序选择最合适的实时解决方案。
什么是 RESTful web 服务？
RESTful（Representational State Transfer）是一种用于构建 Web 应用程序的软件架构风格。它是一组规则和约束，用于设计分布式 Web 应用程序的服务端。RESTful web 服务包含以下关键点：
- 在客户端和服务端之间传递表示层状态。服务器不保存客户端的任何信息，只是将其当做请求处理，并发送回表示层状态的响应。
- 支持无状态请求。将请求看作是单独的事务，这意味着每个请求都包含了足够的信息来执行请求。
- 通过唯一的资源标识符（URI）对资源进行标识，该标识符可以指向一个特定的服务端资源。
- 使用标准的 HTTP 动词（GET、POST、PUT 和 DELETE）来操作服务端资源。
由于 RESTful web 服务的灵活性和易于实现，它已成为 Web 开发的标准之一。当前，许多基于RESTful的后端框架，如Spring、Django、Ruby on Rails等，都被广泛应用于服务端的开发。
什么是 SSE？
Server-Sent Events（SSE）是一种允许服务端向客户端推送事件的web应用程序架构。它利用基于 HTTP 协议的持续连接，将信息从服务端传输到客户端。它包含以下关键特征：
- SSE 客户端从服务端订阅事件流，并在服务端发送新事件时，客户端将收到实时通知。
- SSE 协议仅使用 HTTP 的 GET 请求，这意味着客户端只需要使用浏览器即可。
- SSE 独特的协议确保了可靠、可扩展的通信连接，因此非常适合长时间运行的实时应用程序。
SSE最适合发送不太频繁但重要的信息，如警报、通知等。由于其单向性，它不适合用于双向通信场景中。
RESTful web 服务与 SSE 的比较
在构建实时 Web 应用程序时，RESTful web 服务和 SSE 的用途是不同的。RESTful web 服务适用于双向实时通信，而 SSE 则适用于单向通信。
RESTful web 服务的技术架构允许客户端和服务器之间建立持续的双向通信通道。WebSocket 和 Socket.IO （可同时支持 WebSockets 和轮询）则是主要的实现。使用 RESTful web 服务的优点是，它们允许客户端设备和服务端之间进行实时双向通信。而且，RESTful web服务通常具有更快的响应时间和更高的可靠性，因为与 SSE 或 AJAX 相比，HTTP 连接更稳定，可以在不同的客户端和服务器之间进行多路复用。
另一方面，SSE更适合于单向通信。例如，如果您的应用程序需要在服务端触发事件的同时通知客户端，SSE 就是一种好的选择。它可以避免客户端轮询服务端的情况，从而减少了网络延迟和带宽消耗。SSE 可以通过浏览器 API 很容易地实现，因此在实现的方便程度上，SSE 是优于 WebSocket 和 Socket.IO 的。
如何选择正确的技术
在选择 RESTful web服务和 SSE 之间进行决策时，您需要考虑您的应用程序需要的实时特性。如果您需要实现双向通信，那么 WebSocket 和 Socket.IO 是您的最佳选择。如果您只需要单向通信并且想要快速实现，则 SSE 是您的最佳选择。
在下面的代码示例中，我们将使用 JavaScript 和 Node.js 的 SSE 实现（通过 Express 框架）来说明 SSE 的用法。
服务端代码
在此示例中，我们将使用 Node.js 中的 SSE 库向客户端发送消息。我们还将定义一个路由，以便客户端可以连接并接收 SSE 事件流。
-- -------------------- ---- -------
----- ------- - -------------------
----- --- - ---------------
----- --- - ----------
------------------ ----- ---- -- -
----- --- - --- -------- -----
-- - - -------- --- --
-------------- -- -
---------- ----- ------ ------ ---
-- ------
---
-----------------客户端代码
在客户端代码中，我们将创建一个 EventSource 对象，并将其连接到我们上文定义的 SSE 路由。一旦连接建立，客户端将开始接收来自 SSE 事件流的消息。
const source = new EventSource('/events');
source.addEventListener('message', function (event) {
console.log(event.data); // 打印接收到的消息
});总结
RESTful web 服务和 SSE 是构建实时 Web 应用程序的两种主要技术方案。在选择正确的方案时，您需要考虑您的应用程序需要的实时特征。如果您需要实现双向通信，则 WebSocket 和 Socket.IO 可能是您的最佳选择。如果您只需要单向通信并且想要快速实现，则 SSE 是您的最佳选择。无论您选择哪个解决方案，都需要确保您的实时应用程序可以与您的用户保持连接，并且在用户活动停止时保持连接的状态。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64f192ccf6b2d6eab3b646b7