一. 引入SockJS依賴
1. vue引入依賴
import SockJS from 'sockjs-client';
import Stomp from 'stompjs';
2. maven引入依賴
pom.xml文件添加依賴
<dependency>
<groupId>org.webjars</groupId>
<artifactId>sockjs-client</artifactId>
<version>1.0.2</version>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>stomp-websocket</artifactId>
<version>2.3.3</version>
</dependency>
- html文件里引入jar包的js
<script src="/webjars/sockjs-client/1.0.2/sockjs.min.js"></script>
<script src="/webjars/stomp-websocket/2.3.3/stomp.min.js"></script>
注意: 使用maven引入依賴的項目springboot
二. 創建連接, 訂閱消息
var socket = new SockJS('/wsdemo');
stompClient = Stomp.over(socket);
// 創建連接
stompClient.connect({}, function (frame) {
//訂閱消息
stompClient.subscribe('/topic/message', function (data) {
initOnLine(data.body)
});
);
三. 獲取訂閱的消息
//訂閱消息
stompClient.subscribe('/topic/message', (msg) => {
// 輸出返回的信息
console.log(msg);
// 輸出返回的消息的文本內容
console.log(meg.body);
});