Server-Sent Events 和短轮询的比较及其优缺点分析-JavaScript中文网-JavaScript教程资源分享门户

在前端开发中，实现实时通信是一个非常重要的问题。在这个问题中，我们通常可以使用两种不同的技术：Server-Sent Events 和短轮询。这两种技术都有其各自的优缺点，本文将对它们进行比较及其优缺点分析。

Server-Sent Events

Server-Sent Events (SSE) 是一种基于 HTTP 的实时通信技术。它允许服务器向客户端推送数据，而不需要客户端发起请求。SSE 通过使用一个持久的 HTTP 连接来实现实时通信。当服务器有新的数据可用时，它将数据推送到客户端。SSE 可以使用标准的 HTTP 端口（80 和 443），并且可以通过 SSL 加密进行安全传输。

优点

SSE 允许服务器向客户端实时推送数据，这意味着客户端可以立即看到新的数据，而不需要等待轮询周期。
SSE 使用一个持久的 HTTP 连接，这意味着服务器可以在一次连接中推送多个数据，而不需要建立多个连接。这可以减少服务器的负载。
SSE 支持事件类型，这意味着服务器可以为不同类型的事件推送不同的数据。这可以使客户端更容易地处理不同类型的数据。

缺点

SSE 只能从服务器向客户端推送数据，而不能从客户端向服务器发送数据。如果客户端需要向服务器发送数据，它必须使用另一种技术，如 AJAX。
SSE 不是所有浏览器都支持。虽然大多数现代浏览器都支持 SSE，但一些旧的浏览器可能不支持。
SSE 不支持跨域请求。这意味着 SSE 只能与与当前页面位于同一域的服务器进行通信。

示例代码

以下是一个使用 SSE 实现实时通信的示例代码：

const source = new EventSource('/stream');

source.onmessage = function(event) {
  console.log(event.data);
};

在这个示例中，我们创建了一个 EventSource 对象，并将其连接到一个名为 "/stream" 的 SSE 端点。当服务器向该端点推送数据时，EventSource 对象将触发一个名为 "message" 的事件，并将推送的数据作为事件的数据传递给我们的回调函数。

短轮询

短轮询是一种常见的实时通信技术。它通过定期从服务器请求数据来实现实时通信。客户端定期向服务器发送请求，以查看是否有新的数据可用。如果服务器有新的数据可用，它将在响应中返回数据。如果服务器没有新的数据可用，它将返回一个空响应。

优点

短轮询是一种非常简单的实时通信技术。它不需要任何特殊的协议或技术，只需要使用标准的 HTTP 请求即可。
短轮询可以与所有浏览器兼容。由于短轮询只是标准的 HTTP 请求，因此它可以与所有浏览器兼容。
短轮询可以与任何服务器端技术一起使用。由于短轮询只是标准的 HTTP 请求，因此它可以与任何服务器端技术一起使用，如 PHP、Java 或 Node.js。

缺点

短轮询需要定期发送请求，这意味着它可能会产生大量的网络流量。这可能会导致服务器过载，并且可能会对客户端的网络连接产生负面影响。
短轮询可能会产生延迟。由于客户端需要等待轮询周期才能接收到新的数据，因此短轮询可能会导致客户端看到延迟的数据。
短轮询可能会导致服务器过载。由于客户端需要定期发送请求，服务器可能会因为处理大量请求而过载。

示例代码

以下是一个使用短轮询实现实时通信的示例代码：

-- -------------------- ---- -------
-------- ------ -
  --------------
    -------------- -- ----------------
    ---------- -- -
      ------------------
      ---------------- ------
    ---
-

-------展开代码

在这个示例中，我们使用 fetch() 函数向 "/data" 端点发送请求，并在响应中接收 JSON 格式的数据。我们使用 setTimeout() 函数来定期发送请求，以查看是否有新的数据可用。

比较及其优缺点分析

Server-Sent Events 和短轮询都是实现实时通信的有效技术，它们都有其各自的优缺点。以下是它们的比较及其优缺点分析：

SSE 允许服务器向客户端实时推送数据，而短轮询需要客户端定期发送请求。这意味着 SSE 可以实现更快的实时通信，并且可以减少网络流量。
SSE 使用一个持久的 HTTP 连接，而短轮询需要建立多个连接。这意味着 SSE 可以减少服务器的负载，并且可以更好地缓解网络拥塞。
SSE 支持事件类型，而短轮询需要客户端解析返回的数据。这意味着 SSE 可以更好地解决不同类型的数据，并且可以在客户端更容易地处理数据。
SSE 只能从服务器向客户端推送数据，而短轮询可以从客户端向服务器发送数据。这意味着 SSE 不能满足所有的实时通信需求。
SSE 不是所有浏览器都支持，而短轮询可以与所有浏览器兼容。这意味着 SSE 可能无法满足所有的用户需求。
SSE 不支持跨域请求，而短轮询可以与任何服务器端技术一起使用。这意味着 SSE 只能与与当前页面位于同一域的服务器进行通信。

综上所述，Server-Sent Events 和短轮询都是实现实时通信的有效技术，但它们各自有其优缺点。在选择实时通信技术时，我们需要根据具体情况选择最适合的技术。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/67da2bffa941bf71341e8d9f

Server-Sent Events 和短轮询的比较及其优缺点分析