Spring Boot整合SSE實時通信的問題小結

更新時間：2025年01月13日 14:19:32 作者：晴天飛雪

本文介紹了服務器發(fā)送事件（Server-Sent Events,SSE）技術,其主要特點包括單向數(shù)據(jù)流、自動重連、自定義事件類型等,SSE適用于實時更新場景,如新聞推送、評論系統(tǒng)等,感興趣的朋友跟隨小編一起看看吧

服務器發(fā)送事件（Server-Sent Events, SSE）是一種讓網(wǎng)頁實時更新的技術。想象一下，您正在瀏覽一個網(wǎng)頁，而這個網(wǎng)頁需要在有新信息時自動更新，比如新聞網(wǎng)站的最新消息、社交媒體的通知或股票市場的價格變動。SSE使得這種實時更新成為可能，并且它是通過普通的HTTP連接實現(xiàn)的，這意味著它不需要任何特殊的協(xié)議或復雜的設置。

SSE的主要特點

基于HTTP：SSE使用標準的HTTP協(xié)議來通信，因此它很容易集成到現(xiàn)有的網(wǎng)絡架構中，無需額外配置。
單向數(shù)據(jù)流：與WebSocket不同，SSE只允許服務器向客戶端推送數(shù)據(jù)，而不能反過來。這對于只需要從服務器接收更新的場景非常有用，例如直播評論或通知提醒。
自動重連：如果由于某種原因連接中斷了，瀏覽器會自動嘗試重新連接到服務器，確保用戶不會錯過任何更新。
自定義事件類型：除了基本的數(shù)據(jù)推送外，SSE還允許服務器發(fā)送特定類型的事件，這樣客戶端就可以根據(jù)不同的事件類型做出相應的反應。
輕量級和簡單：相比其他如WebSocket等技術，SSE的實現(xiàn)更為簡單，適合不需要雙向通信的應用場景。對于開發(fā)者來說，這意味著更少的代碼和更容易維護的系統(tǒng)。

添加依賴

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</artifactId>
</dependency>

創(chuàng)建SSE控制器

import java.io.IOException;
import java.util.concurrent.ExecutorService;
import java.util.concurrent.Executors;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.servlet.mvc.method.annotation.SseEmitter;
@CrossOrigin
@RestController
@RequestMapping("sse")
public class SseController {
    private final ExecutorService executorService = Executors.newCachedThreadPool();
    @GetMapping("/handleSse")
    public SseEmitter handleSse() {
        SseEmitter emitter = new SseEmitter();
        executorService.execute(() -> {
            try {
                for (int i = 0; i < 10; i++) {
                    emitter.send(SseEmitter.event().name("message").data("數(shù)據(jù)庫來消息了" + i));
                    Thread.sleep(1000);
                }
                emitter.complete();
            } catch (IOException | InterruptedException e) {
                emitter.completeWithError(e);
            }
        });
        return emitter;
    }
}

客戶端實現(xiàn)

<!DOCTYPE html>
<html>
<body>
<h1>SSE Demo</h1>
<div id="messages"></div>
<button id="connectButton">連接</button>
<button id="disconnectButton" disabled>斷開連接</button>
<script>
    let eventSource = null;
    const messages = document.getElementById('messages');
    const connectButton = document.getElementById('connectButton');
    const disconnectButton = document.getElementById('disconnectButton');
    function connect() {
        if (eventSource) return; // 如果已經(jīng)連接，則不重復創(chuàng)建
        eventSource = new EventSource('http://localhost:8081/items/handleSse');
        eventSource.onmessage = function(event) {
            const message = document.createElement('p');
            message.textContent = event.data;
            messages.appendChild(message);
        };
        eventSource.onerror = function(error) {
            console.error('EventSource failed:', error);
            disconnect(); // 在發(fā)生錯誤時也嘗試斷開連接
        };
        // 禁用連接按鈕，啟用斷開連接按鈕
        connectButton.disabled = true;
        disconnectButton.disabled = false;
    }
    function disconnect() {
        if (!eventSource) return; // 如果沒有連接，則不執(zhí)行任何操作
        eventSource.close();
        eventSource = null;
        // 啟用連接按鈕，禁用斷開連接按鈕
        connectButton.disabled = false;
        disconnectButton.disabled = true;
    }
    // 給按鈕添加事件監(jiān)聽器
    connectButton.addEventListener('click', connect);
    disconnectButton.addEventListener('click', disconnect);
</script>
</body>
</html>

SSE（服務器發(fā)送事件）的優(yōu)缺點及適用場景

優(yōu)點

簡單易用：與WebSocket相比，SSE不需要復雜的握手過程。它的API設計直觀，開發(fā)者可以更快速地上手。
廣泛的瀏覽器支持：幾乎所有現(xiàn)代瀏覽器都支持SSE，包括手機和平板上的瀏覽器，這意味著它幾乎可以在任何設備上工作。
高效能和低延遲：相較于傳統(tǒng)的輪詢方式，SSE減少了不必要的請求次數(shù)，降低了服務器負擔，并提高了數(shù)據(jù)更新的速度。
自動重連功能：當網(wǎng)絡連接中斷時，瀏覽器會自動嘗試重新連接到服務器，這簡化了開發(fā)者的代碼。

缺點

單向通信限制：SSE只允許服務器向客戶端推送信息，如果需要從客戶端向服務器發(fā)送數(shù)據(jù)，則必須使用其他方法或技術。
依賴HTTP長連接：雖然SSE優(yōu)化了數(shù)據(jù)傳輸，但它的實現(xiàn)仍然基于HTTP連接，這可能在網(wǎng)絡條件不佳或者通過某些代理服務器時遇到問題。

適用場景

SSE非常適合用于那些只需要服務器向客戶端推送實時更新的應用場景，例如：

實時新聞更新
股票價格變動通知
社交媒體動態(tài)提醒
實時評論流
系統(tǒng)狀態(tài)監(jiān)控

SSE vs. 輪詢 vs. WebSocket

SSE與輪詢的區(qū)別：傳統(tǒng)輪詢是客戶端定時詢問服務器是否有新數(shù)據(jù)，這種方式不僅增加了服務器的壓力，也帶來了較高的延遲。而SSE讓服務器在有新數(shù)據(jù)時主動推送給客戶端，減少了不必要的請求，提升了性能和用戶體驗。
SSE與WebSocket的對比：
- 通信方向：WebSocket支持雙向通信，意味著客戶端和服務器都可以隨時發(fā)送消息；而SSE僅允許服務器向客戶端推送信息。
- 協(xié)議基礎：WebSocket使用了自己的協(xié)議，而SSE基于標準的HTTP/HTTPS協(xié)議，使得SSE更容易部署并且更易于調試。
- 連接管理：WebSocket建立后保持連接開放，直到被顯式關閉；而SSE會在每次事件推送后自然斷開，然后根據(jù)需要重新建立連接。
- 兼容性和安全性：由于SSE基于HTTP協(xié)議，因此它在網(wǎng)絡穿越方面表現(xiàn)得更好，并且能夠更好地利用現(xiàn)有的安全機制（如HTTPS）。
選擇建議
- 輪詢：適合于對實時性要求不高、只需要偶爾檢查更新的場景。不過，這種方式會增加服務器的負載。
- SSE：對于需要實時推送更新但不涉及雙向通信的應用來說，SSE是一個很好的選擇，因為它實現(xiàn)簡單，而且瀏覽器兼容性好。
- WebSocket：適用于需要頻繁雙向通信的應用，比如在線聊天室或多人在線游戲。