WebSocket 通信流程，注解和Spring实现WebSocket ，实战多人聊天室系统

一、前言

实现即时通信常见的有四种方式-分别是：轮询、长轮询(comet)、长连接(SSE)、WebSocket。

①短轮询

很多网站为了实现推送技术，所用的技术都是轮询。轮询是在特定的的时间间隔（如每1秒），由客户端浏览器对服务器发出HTTP请求，然后由服务器返回最新的数据给客户端的浏览器。

优点：后端编码比较简单

缺点：这种传统的模式带来很明显的缺点，由于HTTP请求是单向的,是只能由客户端发起请求,由服务端响应的【请求-响应模式】，即客户端的浏览器需要不断的向服务器发出请求，然而HTTP请求可能包含较长的头部，其中真正有效的数据可能只是很小的一部分，显然这样会浪费很多的带宽等资源。

短轮询

②长轮询

客户端向发起一个到服务端的请求，然后服务端一直保持连接打开，直到数据发送到客户端为止。

优点：避免了服务端在没有信息更新时的频繁请求，节省流量

缺点：服务器一直保持连接会消耗资源，需要同时维护多个线程，而服务器所能承载的 TCP 连接是有上限的，所以这种轮询很容易导致连接上限。

长轮询

③长连接

客户端和服务端建立连接后不进行断开，之后客户端再次访问这个服务端上的内容时，继续使用这一条连接通道（长轮询是一次发送完后就断开了，）

优点：消息即时到达，不发无用请求

缺点：与长轮询一样，服务器一直保持连接是会消耗资源的，如果有大量的长连接的话，对于服务器的消耗是巨大的，而且服务器承受能力是有上限的，不可能维持无限个长连接。

HTTP长连接

④WebSocket

客户端向服务器发送一个携带特殊信息的请求头（Upgrade:WebSocket ）建立连接，建立连接后双方即可实现自由的实时双向通信。

优点：

较少的控制开销。在连接创建后，服务器和客户端之间交换数据时，用于协议控制的数据包头部相对较小。
更强的实时性。由于协议是全双工的，所以服务器可以随时主动给客户端下发数据。相对于HTTP请求需要等待客户端发起请求服务端才能响应，延迟明显更少；即使是和Comet等类似的长轮询比较，其也能在短时间内更多次地传递数据。
保持连接状态。与HTTP不同的是，Websocket需要先创建连接，这就使得其成为一种有状态的协议，之后通信时可以省略部分状态信息。而HTTP请求可能需要在每个请求都携带状态信息（如身份认证等）。

缺点：相对来说，开发成本和难度更高

WebSocket

⑤对比总结

	轮询（Polling）	长轮询（Long-Polling）	Websocket	长连接（SSE）
通信协议	http	http	tcp	http
触发方式	client(客户端)	client(客户端)	client、server(客户端、服务端)	client、server(客户端、服务端)
优点	兼容性好容错性强，实现简单	比短轮询节约资源	全双工通讯协议，性能开销小、安全性高，可扩展性强	实现简便，开发成本低
缺点	安全性差，占较多的内存资源与请求数	安全性差，占较多的内存资源与请求数	传输数据需要进行二次解析，增加开发成本及难度	只适用高级浏览器
延迟	非实时，延迟取决于请求间隔	非实时，延迟取决于请求间隔	实时	非实时，默认3秒延迟，延迟可自定义

长连接和长轮询的区别：长轮询的含义就是客户端发起请求，如果服务端的数据没有发生变更，那么就hold住请求，直到服务端的数据发生了变更，或者达到了一定的时间就会返回。这样就减少了客户端和服务端不断频繁连接和传递数据的过程，并且不会消耗服务端太多资源。长连接指的是TCP链接长久保持复用。

二、WebSocket概述

WebSocket使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在WebSocket API中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。很多网站为了实现推送技术，所用的技术都是轮询。轮询是在特定的时间间隔（如每1秒），由浏览器对服务器发出，然后由服务器返回最新的数据给客户端的浏览器。这种传统的模式带来很明显的缺点，即浏览器需要不断的向服务器发出请求，然而HTTP请求可能包含较长的头部，其中真正有效的数据可能只是很小的一部分，显然这样会浪费很多的带宽等资源。

而比较新的技术去做轮询的效果是长轮询(comet)。这种技术虽然可以双向通信，但依然需要反复发出请求。而且在Comet中，普遍采用的长链接，也会消耗服务器资源。

在这种情况下，HTML5定义了WebSocket协议，能更好的节省服务器资源和带宽，并且能够更实时地进行通讯。

1.Java接入WebSocket的两种方式

①基于JAVA注解实现

服务端

package com.mc.wsdemo.java;

import lombok.extern.slf4j.Slf4j;
import org.springframework.scheduling.annotation.Scheduled;
import org.springframework.stereotype.Component;

import javax.websocket.OnClose;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.ServerEndpoint;
import java.io.IOException;
import java.util.Map;
import java.util.concurrent.ConcurrentHashMap;

/**
 * 监听websocket地址/myWs
 */
@ServerEndpoint("/myWs")
@Component
@Slf4j
public class WsServerEndpont {
    static Map<String,Session> sessionMap = new ConcurrentHashMap<>();
    //连接建立时执行的操作
    @OnOpen
    public void onOpen(Session session){
        sessionMap.put(session.getId(),session);
        log.info("websocket is open");
    }
    //收到了客户端消息执行的操作
    @OnMessage
    public String onMessage(String text){
        log.info("收到了一条消息："+text);
        return "已收到你的消息";
    }
    //连接关闭的时候执行的操作
    @OnClose
    public void onClose(Session session){
        sessionMap.remove(session.getId());
        log.info("websocket is close");
    }


    //每2s发送给客户端心跳消息，设置一个定时任务
    @Scheduled(fixedRate = 2000)
    public void sendMsg() throws IOException {
        for(String key:sessionMap.keySet()){
            sessionMap.get(key).getBasicRemote().sendText("心跳");
        }
    }
}

配置类

package com.mc.wsdemo.java;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.server.standard.ServerEndpointExporter;


@Configuration 注解表明这是一个Spring的配置类，其中包含了一些用于生成bean的方法。
ServerEndpointExporter 是Spring对WebSocket的支持类，它负责扫描并自动注册所有通过
@ServerEndpoint注解标记的WebSocket端点类。


@Bean 注解方法 serverEndpointExporter()告诉Spring容器去实例化一个ServerEndpointExporter 
bean，并将其添加到IoC容器中。这样，在Spring应用启动时，ServerEndpointExporter就会自动发现
并注册那些使用了@ServerEndpoint注解的WebSocket端点，无需手动配置或初始化。




@Configuration
public class WebSocketConfig {
    @Bean
    public ServerEndpointExporter serverEndpointExporter(){
        return new ServerEndpointExporter();
    }
}

客户端

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ws client</title>
</head>
<body>
<p style="border:1px solid black;width: 600px;height: 500px" id="talkMsg"></p>
<input id="message" /><button id="sendBtn" onclick="sendMsg()">发送</button>
</body>
<script>
    let ws = new WebSocket("ws://localhost:8080/myWs1")
    // ws.onopen=function () {
    // }
    ws.onmessage=function (message) {
        document.getElementById("talkMsg").innerHTML = message.data
    }
    function sendMsg() {
        ws.send(document.getElementById("message").value)
        document.getElementById("message").value=""
    }
</script>
</html>

效果

②Spring框架实现WebSocket服务器端：多人聊天室

package com.mc.wsdemo.spring;

import lombok.extern.slf4j.Slf4j;
import org.springframework.http.server.ServerHttpRequest;
import org.springframework.http.server.ServerHttpResponse;
import org.springframework.stereotype.Component;
import org.springframework.web.socket.WebSocketHandler;
import org.springframework.web.socket.server.support.HttpSessionHandshakeInterceptor;

import java.util.Map;

/**
 * 握手拦截器
 *HttpSessionHandshakelnterceptor (抽象类):握手拦截器，在握手前后添加操作
 */
@Component
@Slf4j
public class MyWsInterceptor extends HttpSessionHandshakeInterceptor {
    @Override
    public boolean beforeHandshake(ServerHttpRequest request, ServerHttpResponse response, WebSocketHandler wsHandler, Map<String, Object> attributes) throws Exception {
        //在这里实现自己逻辑，最后都要调用父类的方法
        log.info(request.getRemoteAddress().toString()+"开始握手");
        return super.beforeHandshake(request, response, wsHandler, attributes);
    }

    @Override
    public void afterHandshake(ServerHttpRequest request, ServerHttpResponse response, WebSocketHandler wsHandler, Exception ex) {
        log.info(request.getRemoteAddress().toString()+"完成握手");
        super.afterHandshake(request, response, wsHandler, ex);
    }
}

/**
 * web socket 主处理程序
 * AbstractWebSocketHandler (抽象类) :WebSocket处理程序，监听连接前，连接中，连接后
 */

@Slf4j
@Component
public class MyWsHandler extends AbstractWebSocketHandler {
    private static Map<String,SessionBean> sessionBeanMap ;

//这里定义为一个map，这个Map<String,Session>这样写不能封装自己的信息，所以我们封装了一个sessionBeanMap
    private static AtomicInteger clientIdMaker;//定义一个整型
    private static StringBuffer stringBuffer;//定义一个字符串缓冲区
    static {
        sessionBeanMap = new ConcurrentHashMap<>();//在静态代码快里初始化map.
        clientIdMaker = new AtomicInteger(0);//线程安全初始化整型
        stringBuffer = new StringBuffer();
    }

    //连接建立
    @Override
    public void afterConnectionEstablished(WebSocketSession session) throws Exception {

在 MyWsHandler 中，自定义了在连接建立之后存储 SessionBean 并发送通知消息的操作，但同时通过调
用 super.afterConnectionEstablished(session) 确保没有遗漏掉 Spring WebSocket 框架内部预设的
连接管理逻辑。如果不调用 super 方法，可能会错过某些重要的框架内置功能，影响整个 WebSocket 服务
的正确运行。

        super.afterConnectionEstablished(session);
        SessionBean sessionBean = new SessionBean(session,clientIdMaker.getAndIncrement());//调用我们封装类的构造方法。
        sessionBeanMap.put(session.getId(),sessionBean);
        log.info(sessionBeanMap.get(session.getId()).getClientId()+"建立了连接");
        stringBuffer.append(sessionBeanMap.get(session.getId()).getClientId()+"进入了群聊<br/>");
        sendMessage(sessionBeanMap);
    }
    //收到消息
    @Override
    protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
        super.handleTextMessage(session, message);
        log.info(sessionBeanMap.get(session.getId()).getClientId()+":"+message.getPayload());
        stringBuffer.append(sessionBeanMap.get(session.getId()).getClientId()+":"+message.getPayload()+"<br/>");
        sendMessage(sessionBeanMap);
    }
    //传输异常
    @Override
    public void handleTransportError(WebSocketSession session, Throwable exception) throws Exception {
        super.handleTransportError(session, exception);
        if(session.isOpen()){
            session.close();
        }
        sessionBeanMap.remove(session.getId());
    }
    //连接关闭
    @Override
    public void afterConnectionClosed(WebSocketSession session, CloseStatus status) throws Exception {
        super.afterConnectionClosed(session, status);
        int clientId = sessionBeanMap.get(session.getId()).getClientId();
        sessionBeanMap.remove(session);
        log.info(clientId+"关闭了连接");
        stringBuffer.append(clientId+"退出了群聊<br/>");
        sendMessage(sessionBeanMap);
    }

//    //每2s发送给客户端心跳消息
//    @Scheduled(fixedRate = 2000)
//    public void sendMsg() throws IOException {
//        for(String key:sessionBeanMap.keySet()){
//            sessionBeanMap.get(key).getWebSocketSession().sendMessage(new TextMessage("心跳"));
//        }
//    }
    public void sendMessage(Map<String,SessionBean> sessionBeanMap){
        for(String key:sessionBeanMap.keySet()){
            try {
                sessionBeanMap.get(key).getWebSocketSession().sendMessage(new TextMessage(stringBuffer.toString()));
            } catch (IOException e) {
//                e.printStackTrace();
                log.error(e.getMessage());
            }
        }
    }
}

package com.mc.wsdemo.spring;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.config.annotation.EnableWebSocket;
import org.springframework.web.socket.config.annotation.WebSocketConfigurer;
import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;

import javax.annotation.Resource;

/**
*WebSocketConfigurer (接口):配置程序，比如配置监听哪个端口
*上面的握手拦截器，处理程序的使用
*/


@Configuration
@EnableWebSocket
public class MyWsConfig implements WebSocketConfigurer {
    @Resource
    MyWsHandler myWsHandler;
    @Resource
    MyWsInterceptor myWsInterceptor;
    @Override
    public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
        registry.addHandler(myWsHandler,"/myWs1").addInterceptors(myWsInterceptor).setAllowedOrigins("*");
    }
}

package com.mc.wsdemo.spring;

import lombok.AllArgsConstructor;
import lombok.Data;
import org.springframework.web.socket.WebSocketSession;

@AllArgsConstructor
@Data
public class SessionBean {
    这个是对原Session类的二次封装，加入了一些我们想要的信息，封装曾一个新的类，园session作为属性
    private WebSocketSession webSocketSession;
    private Integer clientId;
}