1、简介
SockJS是一个浏览器JavaScript库，提供了一个类似websocket的对象。SockJS为您提供了一个连贯的，跨浏览器的Javascript API，它在浏览器和web服务器之间创建了一个低延迟，全双工，跨域通信通道。
Sock.JS的一大好处在于提供了浏览器兼容性。优先使用原生WebSocket，如果在不支持websocket的浏览器中，会自动降为轮询的方式
websocket连接已经建立, 由于websocket没有规范payload的格式, 所以应用需要自己去定义payload的格式
websocket的payload可以是文本也可以是二进制. 应用一般会选择用文本.这个文本是什么格式websocket协议本身并没有规定, 由应用自己来定.
于是Stomp.js来了
stomp是一个用于client之间进行异步消息传输的简单文本协议.
2、在vue中的使用
npm 安装
npm install sockjs-client --save
npm install stompjs --save
import SockJS from 'sockjs-client';
import Stomp from 'stompjs';
let stompClient
function createWS(_this) {
const url = xxx
if (!stompClient) {
const socket = new SockJS(url)
// socket.readyState socket的连接状态
// socket 也提供了send close等等方法可以在SockJS的库文件中找到
stompClient = Stomp.over(socket);
}
stompClient.connect({}, function (frame) {
//通过stompClient.subscribe订阅/topic发送的消息
// 可以写多个
stompClient.subscribe(`/topic/lxxx`, function (destination) {
console.log('/topic/locchang----socket---------destination.body', JSON.parse(destination.body))
const result = JSON.parse(destination.body) // socket 异步返回的数据
})
stompClient.subscribe(`/topic/xxx`, function (destination) {
})
})
}
function disconnect() { // 断开socket
if (stompClient) {
stompClient.disconnect()
stompClient = null
}
}
export default {
createWS,
disconnect
}
