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

maven依赖

<dependency>

    <groupId>org.springframework.boot</groupId>

    <artifactId>spring-boot-starter-websocket</artifactId>

</dependency>

常量类

//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一样。

@EnableWebSocketMessageBroker

public 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

@Service

public 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<String> users, WiselyResponse msg) {

        users.forEach(userName -> {

            template.convertAndSendToUser(userName, Constant.P2PPUSHPATH, msg);

        });

    }

}

控制器

@Controller

public class WsController {

    @Resource

    WebSocketService webSocketService;

    @MessageMapping(Constant.FORETOSERVERPATH)//@MessageMapping和@RequestMapping功能类似，用于设置URL映射地址，浏览器向服务器发起请求，需要通过该地址。

    @SendTo(Constant.PRODUCERPATH)//如果服务器接受到了消息，就会对订阅了@SendTo括号中的地址传送消息。

    public WiselyResponse say(WiselyMessage message) throws Exception {

        List<String> users = Lists.newArrayList();

        users.add("d892bf12bf7d11e793b69c5c8e6f60fb");//此处写死只是为了方便测试,此值需要对应页面中订阅个人消息的userId

        webSocketService.send2Users(users, new WiselyResponse("admin hello"));

        return new WiselyResponse("Welcome, " + message.getName() + "!");

    }

}

页面

<!DOCTYPE html>

<html xmlns:th="http://www.thymeleaf.org">

<head>

    <meta charset="UTF-8" />

    <title>Spring Boot+WebSocket+广播式</title>

</head>

<body onload="disconnect()">

<noscript><h2 style="color: #ff0000">貌似你的浏览器不支持websocket</h2></noscript>

<div>

    <div>

        <button id="connect" onclick="connect();">连接</button>

        <button id="disconnect" disabled="disabled" onclick="disconnect();">断开连接</button>

    </div>

    <div id="conversationDiv">

        <label>输入你的名字</label><input type="text" id="name" />

        <button id="sendName" onclick="sendName();">发送</button>

        <p id="response"></p>

        <p id="response1"></p>

    </div>

</div>

<!--<script th:src="@{sockjs.min.js}"></script>

<script th:src="@{stomp.min.js}"></script>

<script th:src="@{jquery.js}"></script>-->

<script src="https://cdn.bootcss.com/sockjs-client/1.1.4/sockjs.min.js"></script>

<script src="https://cdn.bootcss.com/stomp.js/2.3.3/stomp.min.js"></script>

<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>

<script th:inline="javascript">

    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);

    }

</script>

</body>

</html>

springboot整合websocket实现一对一消息推送和广播消息推送的更多相关文章

Springboot整合Websocket遇到的坑
Springboot整合Websocket遇到的坑一.使用Springboot内嵌的tomcat启动websocket 1.添加ServerEndpointExporter配置bean @Confi ...
SpringBoot 整合 WebSocket
SpringBoot 整合 WebSocket(topic广播) 1.什么是WebSocket WebSocket为游览器和服务器提供了双工异步通信的功能,即游览器可以向服务器发送消息,服务器也可以向 ...
SpringBoot整合websocket简单示例
依赖  <dependency> <groupId>org.springframework.boot&l ...
springboot整合websocket原生版
目录 HTTP缺点 HTTP websocket区别 websocket原理使用场景 springboot整合websocket 环境准备客户端连接加入战队微信公众号主题 HTTP请求用于我 ...
SpringBoot整合WebSocket实现前后端互推消息
小编写这篇文章是为了记录实现WebSocket的过程,受不了啰嗦的同学可以直接看代码. 前段时间做项目时设计了一个广播的场景,具体业务不再赘述,最终要实现的效果就是平台接收到的信息实时发布给所有的用户 ...
WebSocket的简单认识&amp&semi;SpringBoot整合websocket
1. 什么是WebSocket?菜鸟对websocket的解释如下 WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议. WebSocket 使得客户端和服务 ...
Springboot整合WebSocket实现网页版聊天，快来围观！
springboot整合websocket高级版
目录 sockjs介绍产生的原因环境搭建 springboot整合sockjs 使用场景聊天室开发点对点通信群聊效果总结加入战队微信公众号上一章节我们说了websocket的优缺点 ...
springboot整合websocket实现客户端与服务端通信
定义 WebSocket是通过单个TCP连接提供全双工(双向通信)通信信道的计算机通信协议.此WebSocket API可在用户的浏览器和服务器之间进行双向通信.用户可以向服务器发送消息并接收事件驱 ...

随机推荐

Linux Epoll相关知识
其实在Linux下设计并发网络程序,向来不缺少方法,比如典型的Apache模型(Process Per Connection,简称PPC),TPC(Thread PerConnection)模型,以及 ...
Webwork 学习之路【04】Configuration 详解
Webwork做为经典的Web MVC 框架,个人觉得源码中配置文件这部分代码的实现十分考究. 支持自定义自己的配置文件.自定义配置文件读取类.自定义国际化支持. 可以作为参考,单独引入到其他项目中, ...
[IOS NSUserDefaults]的使用：登陆后不再显示登录界面。
之前搜了好多地方都没找到实现“登陆后不再显示登录界面,而默认自动登录”的方法. 待我发现有种存储方式叫NSUserDefaults的时候,立马又感觉新技能get了. 简介: NSUserDefault ...
【leetcode】Binary Tree Maximum Path Sum (medium)
Given a binary tree, find the maximum path sum. The path may start and end at any node in the tree. ...
sqlite创建表
create table bike (id ) primary key, password ));
Google OKR 目标管理体系学习
OKR 全称是「目标和关键成果」(Objectives and Key Results).它是Google在公司创立不足一年的时候,从Intel公司引入的目标管理系统,也常被认为是一套组织测评系统. ...
IOSView显示特性设置
一.主要用途弹出模态ViewController是IOS变成中很有用的一个技术,UIKit提供的一些专门用于模态显示的ViewController,如UIImagePickerController等 ...
Delphi Variant oleVariant
The OleVariant type exists on both the Windows and Linux platforms. The main difference between Vari ...
AES 加密
package com.sprucetec.tms.utils; import java.security.Key; import javax.crypto.Cipher;import javax.c ...
[20180627]truncate table的另类恢复&period;txt
[20180627]truncate table的另类恢复.txt --//前几天看链接http://www.xifenfei.com/2018/06/truncate-table-recovery. ...