springboot整合websocket实现一对一消息推送和广播消息推送

springboot基础环境

请参考springboot文档

maven依赖

                    org.springframework.boot            spring-boot-starter-websocket        

代码准备

准备常量类

    //webSocket相关配置    //链接地址    public static String WEBSOCKETPATHPERFIX = "/ws-push";    public static String WEBSOCKETPATH = "/endpointWisely";    //消息代理路径    public static String WEBSOCKETBROADCASTPATH = "/topic";    //前端发送给服务端请求地址    public static final String FORETOSERVERPATH = "/welcome";    //服务端生产地址,客户端订阅此地址以接收服务端生产的消息    public static final String PRODUCERPATH = "/topic/getResponse";    //点对点消息推送地址前缀    public static final String P2PPUSHBASEPATH = "/user";    //点对点消息推送地址后缀,最后的地址为/user/用户识别码/msg    public static final String P2PPUSHPATH = "/msg";

接收前端消息实体

public class WiselyMessage {    private String name;    public String getName() {        return name;    }    public void setName(String name) {        this.name = name;    }}

后台发送消息实体

private String responseMessage;    public WiselyResponse(String responseMessage){        this.responseMessage = responseMessage;    }    public String getResponseMessage() {        return responseMessage;    }    public void setResponseMessage(String responseMessage) {        this.responseMessage = responseMessage;    }配置websocket@Configuration// @EnableWebSocketMessageBroker注解用于开启使用STOMP协议来传输基于代理（MessageBroker）的消息，这时候控制器（controller）// 开始支持@MessageMapping,就像是使用@requestMapping一样。@EnableWebSocketMessageBrokerpublic class WebSocketConfig extends AbstractWebSocketMessageBrokerConfigurer {    @Override    public void registerStompEndpoints(StompEndpointRegistry stompEndpointRegistry) {        //注册一个Stomp的节点（endpoint）,并指定使用SockJS协议。        stompEndpointRegistry.addEndpoint(Constant.WEBSOCKETPATH).withSockJS();    }    @Override    public void configureMessageBroker(MessageBrokerRegistry registry) {        //服务端发送消息给客户端的域,多个用逗号隔开        registry.enableSimpleBroker(Constant.WEBSOCKETBROADCASTPATH, Constant.P2PPUSHBASEPATH);        //定义一对一推送的时候前缀        registry.setUserDestinationPrefix(Constant.P2PPUSHBASEPATH);        //定义websoket前缀        registry.setApplicationDestinationPrefixes(Constant.WEBSOCKETPATHPERFIX);    }}service@Servicepublic class WebSocketService {    @Autowired    private SimpMessagingTemplate template;    /**     * 广播     * 发给所有在线用户     *     * @param msg     */    public void sendMsg(WiselyResponse msg) {        template.convertAndSend(Constant.PRODUCERPATH, msg);    }    /**     * 发送给指定用户     * @param users     * @param msg     */    public void send2Users(List users, WiselyResponse msg) {        users.forEach(userName -> {            template.convertAndSendToUser(userName, Constant.P2PPUSHPATH, msg);        });    }}

控制器

@Controllerpublic class WsController {    @Resource    WebSocketService webSocketService;    @MessageMapping(Constant.FORETOSERVERPATH)//@MessageMapping和@RequestMapping功能类似，用于设置URL映射地址，浏览器向服务器发起请求，需要通过该地址。    @SendTo(Constant.PRODUCERPATH)//如果服务器接受到了消息，就会对订阅了@SendTo括号中的地址传送消息。    public WiselyResponse say(WiselyMessage message) throws Exception {        List users = Lists.newArrayList();        users.add("d892bf12bf7d11e793b69c5c8e6f60fb");//此处写死只是为了方便测试,此值需要对应页面中订阅个人消息的userId        webSocketService.send2Users(users, new WiselyResponse("admin hello"));        return new WiselyResponse("Welcome, " + message.getName() + "!");    }}

页面

        
    
        连接        断开连接    
            输入你的名字        发送        
        
    

    var stompClient = null;    //此值有服务端传递给前端,实现方式没有要求    var userId = [[${userId}]];    function setConnected(connected) {        document.getElementById('connect').disabled = connected;        document.getElementById('disconnect').disabled = !connected;        document.getElementById('conversationDiv').style.visibility = connected ? 'visible' : 'hidden';        $('#response').html();    }    function connect() {        var socket = new SockJS('/endpointWisely'); //1连接SockJS的endpoint是“endpointWisely”，与后台代码中注册的endpoint要一样。        stompClient = Stomp.over(socket);//2创建STOMP协议的webSocket客户端。        stompClient.connect({}, function(frame) {//3连接webSocket的服务端。            setConnected(true);            console.log('开始进行连接Connected: ' + frame);            //4通过stompClient.subscribe（）订阅服务器的目标是'/topic/getResponse'发送过来的地址，与@SendTo中的地址对应。            stompClient.subscribe('/topic/getResponse', function(respnose){                showResponse(JSON.parse(respnose.body).responseMessage);            });            //4通过stompClient.subscribe（）订阅服务器的目标是'/user/' + userId + '/msg'接收一对一的推送消息,其中userId由服务端传递过来,用于表示唯一的用户,通过此值将消息精确推送给一个用户            stompClient.subscribe('/user/' + userId + '/msg', function(respnose){                console.log(respnose);                showResponse1(JSON.parse(respnose.body).responseMessage);            });        });    }    function disconnect() {        if (stompClient != null) {            stompClient.disconnect();        }        setConnected(false);        console.log("Disconnected");    }    function sendName() {        var name = $('#name').val();        //通过stompClient.send（）向地址为"/welcome"的服务器地址发起请求，与@MessageMapping里的地址对应。因为我们配置了registry.setApplicationDestinationPrefixes(Constant.WEBSOCKETPATHPERFIX);所以需要增加前缀/ws-push/        stompClient.send("/ws-push/welcome", {}, JSON.stringify({ 'name': name }));    }    function showResponse(message) {        var response = $("#response");        response.html(message);    }    function showResponse1(message) {        var response = $("#response1");        response.html(message);    }

测试

点击连接控制台输出

表示连接成功并且订阅了两个地址

此时在文本框内输入任意值，结果如图所示则代表成功

控制台中显示依次为,发送信息,目标长度内容

此时服务端控制器接收到请求

同时给指定用户发送了消息,所以控制台接收到消息

同时因为控制器有注解@SendTo所以会向@SendTo的地址广播消息,客户端订阅了广播地址所有控制台显示接收了消息

扩展阅读

Spring Boot教你一种方法生成全局唯一ID

Spring Boot 配置随机数那些小技巧

RabbitMQ之消息确认机制（事务+Confirm）

分布式服务（RPC）+分布式消息队列（MQ）面试题精选

为什么要进行URL编码

作者：kunm

来源：https://segmentfault.com/a/1190000011908831