在实时 Web 应用中，客户端需要频繁地与服务器进行通信以获取最新数据。常见的两种实现方式是短轮询（Short-polling）和长轮询（Long-polling）。本文将详细介绍这两种方式的优缺点，并提供示例代码和指导建议。
短轮询
短轮询是客户端定期向服务器发送请求，以检查是否有新数据可用。如果没有新数据，则服务器返回空响应。如果有新数据，则服务器返回该数据。然后，客户端重新发起请求以等待下一次检查。
以下是一个短轮询示例：
setInterval(() => {
fetch('/data')
.then(response => response.json())
.then(data => {
// 处理数据
});
}, 1000);短轮询的优点是简单易懂，易于实现。它适用于轻量级应用程序，对服务器资源要求较低。
然而，短轮询也有一些缺点。首先，它浪费带宽，因为大部分时间都是空请求。其次，它不够及时，因为客户端只能在下一次轮询时收到更新的数据。最后，它可能会导致服务器负载过高，因为客户端定期发送请求，即使没有新数据可用。
长轮询
长轮询是客户端向服务器发送一个持久连接，以等待新数据的到达。当有新数据可用时，服务器返回该数据并关闭连接。然后，客户端重新发起连接以等待下一次更新。
以下是一个长轮询示例：
-- -------------------- ---- -------
-------- ---------- -
--------------
-------------- -- ----------------
---------- -- -
-- ----
-----------
--
--------- -- -
-------------------- ------
---
-
-----------长轮询的优点是可以减少带宽浪费，因为客户端只在有新数据时才会收到响应。它也更及时，因为客户端可以立即接收新数据而不必等待下一次轮询。最后，它可以减少服务器负载，因为服务器只在有新数据时才会响应请求。
然而，长轮询也有一些缺点。首先，它需要建立和维护一个持续连接，这可能会导致更复杂的代码。其次，它可能会导致服务器资源的浪费，因为连接可能会在无操作的情况下保持打开状态。
总体而言，短轮询适用于轻量级应用程序，而长轮询适用于需要实时更新且对带宽和服务器负载有限制的应用程序。在实现实时 Web 应用时，开发人员需要根据应用程序的特定需求做出选择。
指导建议
对于轻量级应用程序，请使用短轮询。以下是一个基本示例：
setInterval(() => {
fetch('/data')
.then(response => response.json())
.then(data => {
// 处理数据
});
}, 1000);对于需要实时更新且对带宽和服务器负载有限制的应用程序，请使用长轮询。以下是一个基本示例：
-- -------------------- ---- -------
-------- ---------- -
--------------
-------------- -- ----------------
---------- -- -
-- ----
-----------
--
--------- -- -
-------------------- ------
---
-
-----------您还可以考虑使用 WebSocket
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/27405