突然想开坑写个浏览器端的小游戏，玩家操作之后的状态需要服务器通知给其他的玩家，第一反应用 WebSocket，不过发现 Server-sent Events 就足够了。

感受一下 Server-sent Events

Server-sent Events 允许服务端向浏览器端主动发送消息而不需要浏览器再次请求。原理上是服务端维持一个 Stream，MIME Type 是 text/event-stream。

浏览器端需要通过 EventSource API，它先以 HTTP 请求连接到服务器，并维持连接状态，等待服务端的后续消息。

浏览器支持情况的话，IE 和 Edge 不支持，不过基于 Chromium 的 Edge 当然是没问题的，列表里的 Edge 版本号从 18 直接跳 75 很喜感 😄。

<picture>
    <source srcset="caniuse.webp" type="image/webp" />
    <img src="caniuse.png" alt="Server-sent Events 浏览器支持情况">
</picture>


    <figcaption>
        Server-sent Events 浏览器支持情况
    </figcaption>

JavaScript 示意一下的话：

const src = new EventSource("/event")
src.AddEventListerer("eventName", function(ev) {
    console.log(ev)
})

服务端在用 gin 的话是这个样子：

r.GET("/events", func(c *gin.Context) {
    c.Stream(func(w io.Writer) bool {
        c.SSEvent("eventName", gin.H{
            "some": "data",
        })
        return false
    })
})

<picture>
    <source srcset="network.webp" type="image/webp" />
    <img src="network.png" alt="Network">
</picture>


    <figcaption>
        Network
    </figcaption>