websocket 通信的实现

https://blog.csdn.net/quanyuejie/article/details/53896140
https://blog.csdn.net/m0_37542889/article/details/83750665
https://www.cnblogs.com/goeasycloud/p/9355164.html
https://blog.csdn.net/elonpage/article/details/78446695
https://www.cnblogs.com/shixiuxian/p/8192285.html

采用socketjs和stompjs,npm安装了sockjs-client模块和stompjs模块。sockjs-client是从SockJS中分离出来的用于客户端使用的通信模块。
采用socketjs的原因：
一些浏览器中缺少对WebSocket的支持,因此，回退选项是必要的，而Spring框架提供了基于SockJS协议的透明的回退选项。SockJS提供了浏览器兼容性,优先使用原生的WebSocket,如果某个浏览器不支持WebSocket,SockJS会自动降级为轮询.

采用stompjs的原因
STOMP(Simple Text-Orientated Messaging Protocol) 面向消息的简单文本协议; WebSocket是一个消息架构,不强制使用任何特定的消息协议,它依赖于应用层解释消息的含义.与HTTP不同,WebSocket是处在TCP上非常薄的一层,会将字节流转化为文本/二进制消息,因此,对于实际应用来说,WebSocket的通信形式层级过低,因此，可以在 WebSocket 之上使用STOMP协议，来为浏览器和 server间的通信增加适当的消息语义。
客户端使用

 // 建立连接对象（还未发起连接）
     var socket=new SockJS("10.3.54.2:8080/endpointChat");
    //socket连接对象也可通过WebSocket(不通过SockJS)连接
    //var socket=new WebSocket("10.3.54.2:8080/endpointChat");
    
    // 获取 STOMP 子协议的客户端对象
    var stompClient = Stomp.over(socket);
    //如果使用原生的Websockets就使用Stomp.client(url)，如果需要使用其他类型的Websocket（例如由SockJS包装的Websocket）就使用Stomp.over(ws)。
    
   // 向服务器发起websocket连接并发送CONNECT帧
   stompClient.connect(
     {},
     function connectCallback (frame) {
       // 连接成功时（服务器响应 CONNECTED 帧）的回调方法
        console.log('已连接【' + frame + '】');
        //订阅消息 ，/topic/getResponse为服务器 @SendTo 匹配的 URL，字符串；
        stompClient.subscribe('/topic/getResponse', function (response) {
            //处理response，STOMP 帧的 body 必须是 string 类型，即response.body为字符串，需自行进行json转换
            showResponse(response.body);
        });
     },
     function errorCallBack (error) {
      // 连接失败时（服务器响应 ERROR 帧）的回调方法
       console.log('连接失败【' + error + '】');
    }
    );

其中，stompClient.connect()方法签名：client.connect(headers, connectCallback, errorCallback);
headers表示客户端的认证信息,若无需认证，直接使用空对象 “{}” 即可；

     var headers = {
     login: 'mylogin',
     passcode: 'mypasscode',
    // additional header
    'client-id': 'my-client-id'
    };

在大多数情况下，connect()方法可接受不同数量的参数来提供简单的API：

client.connect(login, passcode, connectCallback);
client.connect(login, passcode, connectCallback, errorCallback);
client.connect(login, passcode, connectCallback, errorCallback, host);

login和passcode是strings，connectCallback和errorCallback则是functions。（有些brokers（代理）还需要传递一个host（String类型）参数。）
如果你需要附加一个headers头部，connect方法还接受其他两种形式的参数：

client.connect(headers, connectCallback);
client.connect(headers, connectCallback, errorCallback);

** 断开连接：**

    //关闭长连接
    client.disconnect(function () {
    alert("See you next time!");
   };

本项目中针对不同用户权限推送不同的消息的处理方式：
在connect()方法中可以带login, passcode来确定是哪个用户在请求数据，可以把发起连接的用户信息放入这个里面，
也可以把用户信息放入connect()方法的headers中。
但是因为获取login, passcode或headers的时机是成功建立连接后，而我们的需求是如果用户token验证不过，则不允许建立连接。
我们的做法是在建立的连接对象中带token，后端通过token来判断是哪个用户在请求，将websocket和token挂钩，针对不同用户权限推送不同的消息。
同时，采用STOMP 的消息前缀为/user.

STOMP 的消息根据前缀的不同分为/user，/topic或 /queue， /app三种,代表不同的发送消息到客户端方式

/app:实现自由的向任意目的地发送消息，并且订阅此目的地的所有用户都能收到消息。
/topic或 /queue：消息都会发送到STOMP代理中，根据你所选择的STOMP代理不同，目的地的可选前缀也会有所限制；
/user:将消息重路由到某个用户独有的目的地上。