1. 什么是sockjs和stompjs

Sock.js(处理兼容性)

支持浏览器:html5的协议,所以老浏览器不支持

兼容怎么办? 

Sock.js来了

Sock.JS的一大好处在于提供了浏览器兼容性。优先使用原生WebSocket,如果在不支持websocket的浏览器中,会自动降为轮询的方式。 

spring也对socketJS提供了支持。

Stomp.js(处理传输协议)

websocket连接已经建立, 由于websocket没有规范payload的格式, 所以应用需要自己去定义payload的格式.

websocket的payload可以是文本也可以是二进制. 应用一般会选择用文本.这个文本是什么格式websocket协议本身并没有规定, 由应用自己来定.

于是Stomp.js来了

stomp是一个用于client之间进行异步消息传输的简单文本协议.

以上介绍参考链接:https://blog.csdn.net/weixin_42052388/article/details/80313752

2. vue中的使用方法

 首先是安装相应的npm包:

npm install sockjs-client --save
npm install stompjs --save

我现在安装的版本是sockjs-client 1.1.5,stompjs 2.3.3

然后在需要建立websocket连接的组件中引入:

import SockJS from 'sockjs-client';
import Stomp from 'stompjs';

在created生命周期中建立连接:

   created:function(){

      let socket = new SockJS('http://192.xxx.xx.xxx:xxxx/gas-eqp');
      let stompClient = Stomp.over(socket);
      stompClient.connect({}, function (frame) {

        stompClient.subscribe('/topic/eqp/register', function (message) {
          console.warn(message.body);
          console.warn(JSON.parse(message.body));

        });
});
}

好了,完成,就是这么简单。

转载于:https://www.cnblogs.com/xianxiaobo/p/9673591.html

Logo

前往低代码交流专区

更多推荐