我在探索ChatGPT的使用過(guò)程中，發(fā)現(xiàn)了一個(gè)有趣的現(xiàn)象：ChatGPT在實(shí)現(xiàn)流式返回的時(shí)候，選擇了SSE（Server-Sent Events），而非WebSocket。

那么問(wèn)題來(lái)了：為什么ChatGPT選擇了SSE，而不是WebSocket呢。

SSE是什么？

SSE，全稱Server-Sent Events，譯為服務(wù)器發(fā)送事件，它是一種Web技術(shù)，允許服務(wù)器端實(shí)時(shí)地向客戶端推送信息。SSE運(yùn)行在HTTP協(xié)議之上，它利用持久化的HTTP連接，以事件流（Event Stream）的形式將數(shù)據(jù)發(fā)送給客戶端，由客戶端監(jiān)聽(tīng)后獲取。服務(wù)器端會(huì)定期向這個(gè)連接發(fā)送更新，這些更新被封裝在一個(gè)或多個(gè)HTTP包中，每個(gè)包含有更新的事件流。這樣，當(dāng)有新的更新時(shí)，服務(wù)器就不需要等待客戶端的請(qǐng)求，而是直接將數(shù)據(jù)推送給客戶端。當(dāng)連接被關(guān)閉或出現(xiàn)故障時(shí)，客戶端會(huì)自動(dòng)重新發(fā)送請(qǐng)求，重新建立連接。這確保了數(shù)據(jù)傳輸?shù)倪B續(xù)性和實(shí)時(shí)性。

那么，SSE有什么優(yōu)點(diǎn)呢?

1. 單向通信：SSE只支持從服務(wù)器到客戶端的單向通信，服務(wù)器可以主動(dòng)發(fā)送數(shù)據(jù)，用戶只能接收。
2. 高效實(shí)時(shí)：因使用持久化連接，服務(wù)器可以實(shí)時(shí)地將數(shù)據(jù)推送給客戶端，而無(wú)需客戶端頻繁發(fā)起請(qǐng)求。

什么是WebSocket？

WebSocket是一種網(wǎng)絡(luò)通信協(xié)議，它最早被提出來(lái)是為了解決HTTP連接的一大限制：HTTP協(xié)議中，一個(gè)客戶端發(fā)送給服務(wù)端的請(qǐng)求必須由服務(wù)端返回一個(gè)響應(yīng)，這使得服務(wù)端無(wú)法主動(dòng)向客戶端推送數(shù)據(jù)。WebSocket的通信過(guò)程如下：

1. 客戶端通過(guò)發(fā)送一個(gè)特殊的HTTP請(qǐng)求向服務(wù)器請(qǐng)求建立WebSocket連接。這個(gè)請(qǐng)求類似于：GET /chat HTTP/1.1 Upgrade: websocket Connection: Upgrade
2. 服務(wù)器響應(yīng)這個(gè)請(qǐng)求，確認(rèn)建立WebSocket連接。這個(gè)響應(yīng)類似于：HTTP/1.1 101 Switching Protocols Upgrade: websocket Connection: Upgrade
3. 之后，客戶端和服務(wù)器就可以通過(guò)這個(gè)常開的連接自由地發(fā)送或接收消息。

SSE與WebSocket的比較

你可能疑問(wèn)，為什么不直接使用WebSocket，它似乎更為通用，也同樣支持實(shí)時(shí)數(shù)據(jù)推送。這就是我們需要對(duì)比兩者的理由。

1. 通信模式：SSE只支持服務(wù)器向客戶端的單向通信，而WebSocket支持全雙工通信，即服務(wù)器和客戶端可以互相發(fā)送數(shù)據(jù)。對(duì)于ChatGPT這樣的應(yīng)用來(lái)說(shuō)，大多數(shù)情況下，用戶的請(qǐng)求是稀疏的，而服務(wù)器的響應(yīng)是密集的，因此，SSE的單向通信模式更為合適。
2. 網(wǎng)絡(luò)協(xié)議：SSE運(yùn)行在HTTP協(xié)議上，因此，它可以提供更高的兼容性和靈活性。舉個(gè)例子，如果你的產(chǎn)品已經(jīng)部署在Web服務(wù)器上，那么你大概率無(wú)需做任何改動(dòng)，就可以使用SSE技術(shù)。而WebSocket則需要單獨(dú)的服務(wù)器和端口。

除此之外，SSE和WebSocket在消息大小、連接數(shù)量、跨域支持等方面都有一些細(xì)微的差別，我們?cè)诰唧w設(shè)計(jì)時(shí)需要根據(jù)實(shí)際需求和制約因素做出選擇。

使用Golang和React實(shí)踐SSE

首先，我們需要?jiǎng)?chuàng)建一個(gè)Golang服務(wù)器。這個(gè)服務(wù)器將監(jiān)聽(tīng)8000端口，等待客戶端的SSE連接請(qǐng)求，并定時(shí)向連接發(fā)送消息。為了簡(jiǎn)單起見(jiàn)，這里我們假設(shè)服務(wù)器每秒產(chǎn)生一條新消息。以下是Golang服務(wù)器的代碼：

package main
?
import ("fmt""log""net/http""time"
)
?
func main() {http.HandleFunc("/events", func(w http.ResponseWriter, r *http.Request) {w.Header().Set("Content-Type", "text/event-stream")w.Header().Set("Connection", "keep-alive")w.Header().Set("Cache-Control", "no-cache")w.Header().Set("Access-Control-Allow-Origin", "*")
?for {fmt.Fprintf(w, "data: Message at %s\n\n", time.Now())if flusher, ok := w.(http.Flusher); ok {flusher.Flush()} else {log.Println("Streaming unsupported!")return}time.Sleep(time.Second)}})http.Handle("/", http.FileServer(http.Dir("static")))log.Println("Listening on localhost:8000")http.ListenAndServe("localhost:8000", nil)
}

然后，我們需要?jiǎng)?chuàng)建一個(gè)React客戶端，這個(gè)客戶端會(huì)建立與Golang服務(wù)器的SSE連接，并在收到新消息時(shí)更新頁(yè)面。以下是React客戶端的代碼：

import React, { useEffect, useState } from 'react';
?
function App() {const [events, setEvents] = useState([]);
?useEffect(() => {const eventSource = new EventSource('http://localhost:8000/events');eventSource.onmessage = (event) => {setEvents((prevState) => [...prevState, event.data]);};}, []);
?return (<div className="App"><h1>Live updates from server</h1>{events.map((event, i) => <p key={i}>{event}</p>)}</div>);
}
export default App;

這個(gè)應(yīng)用程序?qū)姆?wù)器接收一個(gè)每秒更新一次的實(shí)時(shí)數(shù)據(jù)流，并在客戶端將這些更新顯示出來(lái)。

總結(jié)

通過(guò)以上的分析和代碼示例，我們可以明白為什么ChatGPT會(huì)選擇使用SSE而非WebSocket。請(qǐng)記住，無(wú)論選擇哪種實(shí)時(shí)數(shù)據(jù)推送技術(shù)，必須考慮到你的應(yīng)用程序的具體需求，例如數(shù)據(jù)更新的速度、服務(wù)器和客戶端的能力、網(wǎng)絡(luò)條件等等。

如果上面的內(nèi)容對(duì)你有幫助，請(qǐng)點(diǎn)贊收藏哦，我會(huì)分享更多的經(jīng)驗(yàn)~