Server-sent Events(SSE)和长轮询的比较及其优缺点

阅读时长 4 分钟读完

什么是Server-sent Events和长轮询

Server-Sent Events (SSE) 是 HTML5 的一部分,旨在允许浏览器通过普通 HTTP 连接从服务器接收自动更新。 SSE 与 WebSocket 不同,WebSocket 属于一个完整的双向通信协议,而 SSE 只允许服务器向客户端发送数据。

长轮询是指客户端向服务器发起一个请求,服务器不会立即返回结果,而是等待结果有所变化时才返回。一旦服务器返回结果,客户端就会立即再次发起请求,周而复始地不停轮询。

Server-sent Events与长轮询的对比

SSE的优点:

  1. 实时性更强。SSE 是基于 HTTP 协议的通信方式,利用消息推送,实现即时更新。
  2. 更流畅地嵌套于已有的 Web 技术,如CSS和JavaScript。
  3. SSE 可以在客户端设置重连和自定义时间间隔,增强了对网络控制的能力。
  4. 不需要像 WebSocket 需要完整的协议交互,扩展更加简单。

SSE的缺点:

  1. SSE 通信协议,需要浏览器端支持 EventSource 类。
  2. SSE 协议要求在服务端保持长时间的连接,增加了服务器端支持的维护成本。

长轮询的优点:

  1. 能够应用于所有的浏览器,因为它是基于 XMLHttpRequest。
  2. 能够向后兼容旧版本的浏览器。
  3. 由于客户端会不断请求,可以避免因负载过大导致服务器崩溃的问题。
  4. 服务器端不需要维持一个长连接,降低了服务器端需要处理连接数的问题。

长轮询的缺点:

  1. 效率偏低。由于需要不停地轮询,相当一部分请求都是没有意义的。
  2. 每次请求都包含 HTTP头文件,太浪费带宽。
  3. 服务端可以“看”到每个请求,从而知道客户端的状态,容易造成安全问题。

Server-sent Events与长轮询的应用

SSE的代码示例:

在 HTML 中引入 EventSource 的 JS 库并建立连接:

服务端的 Node.js 示例:

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

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

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

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

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

长轮询的代码示例:

Javascript 代码:

服务端的 Node.js 示例:

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

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

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

总结

对于需要实时性的应用来说,Server-sent Events 的效率较好,但服务器端需要开启长连接,增加了维护的成本。长轮询虽然效率偏低,但却能适用于所有的浏览器,并且不需要维持长连接。因此,在实际使用过程中,需要根据实际的应用场景进行选择。

学习和指导意义

两种技术各有其适用场景和优缺点,在实际开发中需要根据实际情况进行技术选择。在选择技术时要权衡优缺点,避免将技术的使用推向极端,造成不必要的问题。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/64e80a76f6b2d6eab3373d0b

纠错
反馈