websocket即时通信，前后端互通消息

安装

npm i sockjs-client -S
npm i stompjs -S
// 注: 使用npm的websocket，浏览器兼容性更好。有些浏览器不支持原生的websocket。

使用

// webSocket.js
import SockJs from 'sockjs-client';
import Stomp from 'stompjs';

let stompClient = null;

// 建立连接
let createWebSocket = (params = {}, callBack = () => { }) => {
    // 建立连接对象
    const url = params.url || "ws://pms..."; // 后端提供的连接域名。测试/生产环境可通过location.host获取域名并拼接，如果域名连接不成功，可能域名后会拼接访问路径。
    if(!stompClient){
        const socket = new SockJs(url);
        stompClient = Stomp.over(socket);
    }

    stompClient?.content({}, ()=>{
        // 连接成功
        const topic = params.topic || '/topic/2345';
        // 可以写多个
        stompClient.subscribe(topic, (msg) =>{
            // 订阅服务器提供的某个topic
            const result = JSON.parse(msg.body); // socket异步返回的数据
            console.log('result--websocket==', result);
            callBack?.(result);
        })
    })
}

// 断开socket连接
let disconnectWebSocket = () =>{
    if(stompClient){
        stompClient.disconnect();
        stompClient = null;
    }
}

export default {
    createWebSocket,
    disconnectWebSocket,
}