单服务器推送还在用WebSocket？快试试更快的SSE_Java

在传统的web开发中，websocket常被用来实现实时双向通信。然而，对于只需要单向、从服务器到客户端的信息推送场景，server-sent events (sse) 提供了一种更轻量、更简单的解决方案。

sse 和 websocket 特点的差异

sse 适用于服务器向客户端单向发送实时更新的数据，适合实时事件推送场景。sse 使用的是标准的 http 协议，对于浏览器的兼容性较好，但只支持客户端接收数据。

websocket

websocket 适用于客户端和服务器之间的双向实时通信，适合聊天应用、实时游戏等场景。websocket 需要独立的 tcp 连接，因此相比 sse，会增加一定的网络开销，但能够实现双向通信。

总结：websocket 更复杂，需要专门的服务器和客户端支持。websocket 提供了低延迟和更灵活的通信能力。sse 可以用标准 http 服务实现，对于服务器的改造相对较小。

步骤一：创建sse服务端控制器

首先，我们需要创建一个spring boot控制器来处理sse连接请求。

import org.springframework.web.bind.annotation.getmapping;
import org.springframework.web.bind.annotation.pathvariable;
import org.springframework.web.bind.annotation.restcontroller;
import org.springframework.web.servlet.mvc.method.annotation.sseemitter;

import java.time.localdatetime;
import java.time.format.datetimeformatter;
import java.util.concurrent.concurrenthashmap;
import java.util.concurrent.executors;
import java.util.concurrent.timeunit;


@restcontroller
public class ssecontroller {

    private static final concurrenthashmap<string, sseemitter> emitters = new concurrenthashmap<>();


    @getmapping("/sse/connect/{key}")
    public sseemitter connect(@pathvariable("key")string key) {
        sseemitter sseemitter = new sseemitter();
        emitters.put(key, sseemitter);
        sseemitter.oncompletion(() -> emitters.remove(key));
        sseemitter.onerror((e) -> {
            emitters.remove(key);
            sseemitter.completewitherror(e);
        });
        executors.newsinglethreadexecutor().execute(() -> {
            while (true) {
                datetimeformatter formatter = datetimeformatter.ofpattern("yyyy-mm-dd hh:mm:ss");
                try {
                    sseemitter.send(sseemitter.event().name("message").data("北京时间："+formatter.format(localdatetime.now()) ));
                    timeunit.seconds.sleep(3);
                } catch (exception e) {
                    system.out.println(e.getmessage());
                }
            }
        });
        return sseemitter;
    }


}

这段代码定义了一个ssecontroller，其中connect方法用于建立sse连接。它接收一个路径参数key，用于区分不同的连接。通过sseemitter，服务器每3秒向客户端发送一次当前的北京时间。同时，通过concurrenthashmap管理所有活跃的连接，并在连接关闭或发生错误时进行相应的清理操作。

步骤二：创建前端页面接收sse事件

接下来，我们创建一个简单的html页面来展示如何接收和显示服务器推送的消息。

<html lang="en">
<head>
    <title>服务器信息推送</title>
    <meta charset="utf-8">
    <script>
        let params = new urlsearchparams(window.location.search);
        let eventsource = new eventsource('/sse/connect/' + params.get('id'));
        eventsource.onmessage = function(event) {
            let message = document.createelement('div');
            message.textcontent = event.data;
            document.getelementbyid('messages').appendchild(message);
        };
    </script>
</head>
<body>
    <h1>服务器信息推送demo(只能用于单向通信)</h1>
    <div id="messages" style="display: flex;flex-direction: column;gap: 6px;"></div>
</body>
</html>

这个页面使用javascript的eventsource api来建立与服务器的sse连接。通过url中的查询参数id来唯一标识每个连接。每当服务器发送新的消息，页面就会在<div id="messages">元素内添加一个新的<div>来显示消息内容。

总结：相比websocket，sse在实现上更为简洁，特别适合于那些只需单向通信的应用场景。它能够实时更新客户端的信息，如股票报价、天气预报、通知提醒等，且不需要复杂的握手过程和维护长连接的额外开销。请记住，尽管sse在某些场景下效率更高，但在需要双向通信或更复杂交互的场景下，websocket仍然是更好的选择。