vue使用SockJS实现webSocket通信_sockjs跨域连接,认证

SockJS简介

SockJS是一个浏览器JavaScript库，它提供了一个类似于网络的对象。SockJS提供了一个连贯的、跨浏览器的Javascript API，它在浏览器和web服务器之间创建了一个低延迟、全双工、跨域通信通道。

• SockJS 会优先采用 websocket，如果在不支持websocket的浏览器中，会自动降为轮询的方式；
• 兼容跨浏览器，支持跨域；

SockJS在vue中的使用

锁屏情况下，js 会停止工作，这时，ws 会自动关闭，当屏幕唤醒时，通过触发 onclose 事件，ws
又会进行重连。在某些特殊业务场景下，需要注意下这种情况。

安装 sockjs-client 和 stompjs

npm install sockjs-client
npm install stompjs
1
2

页面中引入SockJS 和Stomp

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

实现思路

export default {
   
	data() {
   
		return {
   
			stompClient: '',
      		timer: '',
      		socket: null,
      		userId: '',
		}
	},
	mounted(){
   
1
2
3
4
5
6
7
8
9
10
11
12
13