使用STOMP 的目的,目前还有浏览器不支持websocket ,所有用了STOMP
1.pom文件添加
<!-- web socket 需要的 library -->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-websocket</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-messaging</artifactId>
<version>${spring.version}</version>
</dependency>
2.添加WebSocketConfig.java 在能被spring扫描到的包下即可
package com.baiying.kkw.util;
import org.springframework.context.annotation.Configuration;
import org.springframework.messaging.simp.config.MessageBrokerRegistry;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import org.springframework.web.socket.config.annotation.AbstractWebSocketMessageBrokerConfigurer;
import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker;
import org.springframework.web.socket.config.annotation.StompEndpointRegistry;
/**
*
* @author DencyCheng
*
*/
@Configuration
@EnableWebMvc
@EnableWebSocketMessageBroker //能够在 WebSocket 上启用 STOMP
public class WebSocketConfig extends AbstractWebSocketMessageBrokerConfigurer {
@Override
public void configureMessageBroker(MessageBrokerRegistry config) {
config.enableSimpleBroker("/topic");//订阅地址
config.setApplicationDestinationPrefixes("/websocket");
}
public void registerStompEndpoints(StompEndpointRegistry registry) {
//setAllowedOrigins("*") 解决了跨域问题
registry.addEndpoint("/gs-guide-websocket").setAllowedOrigins("*").withSockJS();
}
}
3.添加 WebSocketUtil
package com.baiying.kkw.util;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.messaging.simp.SimpMessagingTemplate;
import org.springframework.stereotype.Component;
/**
*
* @author DencyCheng
*
*/
@Component
public class WebSocketUtil {
@Autowired
private SimpMessagingTemplate messagingTemplate;
/**
* 发送数据
*
* @param url
* @param msg
*/
public void sendMsg(String url, Object msg) {
messagingTemplate.convertAndSend(url, msg);
}
}
4.发送数据
@Autowired
private WebSocketUtil socketUtil;
/**
* /topic/message 要推送的频道
*/
@RequestMapping("/send")
@ResponseBody
public void send() {
socketUtil.sendMsg("/topic/message","拉拉");
}
5.前台接接收
<%@ page language="java" contentType="text/html;charset=utf-8"%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="../css/ydWebLogin.css" />
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/stomp.js/2.3.3/stomp.min.js"></script>
<script src="https://cdn.bootcss.com/sockjs-client/1.0.0/sockjs.min.js"></script>
</head>
<body>
</body>
<script type="text/javascript">
$(document).ready(function() {
var socket = new SockJS('${pageContext.request.contextPath}/gs-guide-websocket');
stompClient = Stomp.over(socket);
stompClient.connect({}, function(frame) {
console.log('Connected: ' + frame);
stompClient.subscribe('/topic/message', function(msg) {
console.log(msg.body);
$("body").append("<p>"+msg.body+"</p>");
});
});
});
</script>
</html>