0.推荐阅读

由于国庆前后实在是太多事了，导致这篇文章更新的比较慢，忘记了的同学可以先阅读下上篇文章，本篇文章将在上篇的基础上进行。

spring boot+ websocket 推送1.配置类

上篇文章我们提到过stomp.js 和 sockjs，下面我将基于stomp上层协议编写配置类，与上篇文章中的配置类有所不同。好了，不多比比，直接上代码

@Configuration@EnableWebSocketMessageBrokerpublic class WebsocketConfig implements WebSocketMessageBrokerConfigurer {    @Override    public void registerStompEndpoints(StompEndpointRegistry registry) {        registry.addEndpoint("/broadcast","/p2p").setAllowedOrigins("*").withSockJS();    }    @Override    public void configureMessageBroker(MessageBrokerRegistry registry) {        registry.enableSimpleBroker("/topic","/user");    }}

通过注解@EnableWebSocketMessageBroker 开启基于stomp的消息代理，此时浏览器支持使用@MessageMapping。这里重写了2个方法，即registerStompEndpoints 和 configureMessageBroker。在registerStompEndpoints 中，注册了2个端点，一个是广播，一个是点对点，并允许以sockjs协议连接。在configureMessageBroker中，对应的配置了2个消息代理。2.编写消息控制器

@Controllerpublic class MessagController {    @Autowired    private SimpMessagingTemplate messagingTemplate;    @MessageMapping("/subcrib")    public void subcrib(ReveiceMsg reveiceMsg) { //ReveiceMsg 是简单的自定义的消息类        messagingTemplate.convertAndSend("/topic/response",reveiceMsg.getName());    }    @MessageMapping("/queue")    public void queue(ReveiceMsg reveiceMsg) { // 这里指定发送给zs        messagingTemplate.convertAndSendToUser("zs","/message",reveiceMsg.getName());    }}

3.客户端广播页面

<div>    <div>        <button id="connect" onclick="connect();">Connect</button>        <button id="disconnect" disabled="disabled" onclick="disconnect();">Disconnect</button>    </div>    <div id="conversationDiv">        <labal>名字</labal><input type="text" id="name" />        <button id="sendName" onclick="sendName();">Send</button>        <p id="response"></p>    </div></div><script src="js/stomp.min.js"></script><script src="js/sockjs.min.js"></script><script src="js/jquery.min.js"></script><script type="text/javascript">    var stompClient = null;    function setConnected(connected){        document.getElementById("connect").disabled = connected;        document.getElementById("disconnect").disabled = !connected;        $("#response").html();    }    function connect() {        var socket = new SockJS(";);        stompClient = Stomp.over(socket);        stompClient.connect({}, function(frame) {            setConnected(true);            console.log('Connected: ' + frame);            stompClient.subscribe('/topic/response', function(response){                console.log("resp 消息：" + response.body);                var response1 = document.getElementById('response');                response1.innerHTML = "<p>订阅：" + response.body + "</p>";            });        });    }    function disconnect() {        if (stompClient != null) {            stompClient.disconnect();        }        setConnected(false);        console.log("Disconnected");    }    function sendName() {        var name = document.getElementById('name').value;        //console.info(1111111111);        stompClient.send("/subcrib", {}, JSON.stringify({ 'name': name }));    }</script>

var socket = new SockJS(";) 这里的url 好像必须要写全，大家可以自行去测试下，看写成new SockJS("/broadcast") 有没有效果。‘/broadcast’ 这里的 正是我们之前在配置类里注册的端点，忘记的可以往上看一看。stompClient.subscribe('/topic/response', {}),我们订阅的路径正是控制器中编写的路径，待会我们就测试往/subcrib 中发送消息，看能不能接收到。4.客户端点对点页面

其实这个页面和广播的那个页面区别不大，我下面只展示核心部分，其他的可以参考上面的广播页面。

function connect() {  var socket = new SockJS(";);  stompClient = Stomp.over(socket);  stompClient.connect({}, function(frame) {    setConnected(true);    console.log('Connected: ' + frame);    stompClient.subscribe('/user/'+document.getElementById('user').value+'/message', function(response){      console.log("resp  user 消息：" + response.body);      var response1 = document.getElementById('response');      response1.innerHTML = "<p>订阅：" + response.body + "</p>";    });  });}function sendName() {  var name = document.getElementById('name').value;  stompClient.send("/queue", {}, JSON.stringify({ 'name': name }));}

注意，此时订阅的地址为 /user/{userId}/message,说明只有userId这个能收到。5.测试运行测试topic，我们开2个窗口，访问/index（这个controller我没放上去，只是一个跳转的），进入到 topic页面，分别点击Connect 按钮，然后在下面输入框中输入消息“诗意凌风”，可以看到，2个窗口都接受到了消息。

测试topic

测试点对点，同样开2个窗口，访问/index1，进入到queue页面，然后输入用户名称（这里就相当于userId了），点击连接按钮，发送“诗意凌风” ，可以看到只有用户为zs 的收到了消息。

测试点对点

小结

好了，今天就分享到这了，有需要这个demo的，可以关注一下小编，后续小编会抽时间把代码上传到gitee，。喜欢的朋友请一键三连[奋斗][奋斗][奋斗]，最后祝大家中秋国庆节日快乐。关注小编，与你共同成长！