初识WebSocket(一)--WebSocket介绍与实现简单web群聊

本文介绍了WebSocket作为HTML5的一种新协议,用于实现客户端与服务器的全双工通信。文章详细讨论了为什么需要WebSocket,以及其与HTTP协议的区别。接着,深入解析WebSocket原理,并提到了STOMP协议在WebSocket中的应用。最后,通过SpringBoot演示了如何配置WebSocket并实现一个简单的Web群聊功能。
摘要由CSDN通过智能技术生成

1.什么是WebSocket?

WebSocket 是 HTML5 的一种新协议,不同于http协议,WebSocket实现了客户端与服务器端的全双工通信,即允许服务器端主动推送消息给客户端。

2.为什么需要WebSocket?

因为Http协议做不到。 选取了我认为比较好的解释,摘自廖雪峰的官方网站,如下:

为什么传统的HTTP协议不能做到WebSocket实现的功能?

这是因为HTTP协议是一个请求-响应协议,请求必须先由浏览器发给服务器,服务器才能响应这个请求,再把数据发送给浏览器。换句话说,浏览器不主动请求,服务器是没法主动发数据给浏览器的。

这样一来,要在浏览器中搞一个实时聊天,或者在线多人游戏的话就没法实现了,只能借助Flash这些插件。

也有人说,HTTP协议其实也能实现啊,比如用轮询或者Comet。轮询是指浏览器通过JavaScript启动一个定时器,然后以固定的间隔给服务器发请求,询问服务器有没有新消息。这个机制的缺点一是实时性不够,二是频繁的请求会给服务器带来极大的压力。

Comet本质上也是轮询,但是在没有消息的情况下,服务器先拖一段时间,等到有消息了再回复。这个机制暂时地解决了实时性问题,但是它带来了新的问题:以多线程模式运行的服务器会让大部分线程大部分时间都处于挂起状态,极大地浪费服务器资源。另外,一个HTTP连接在长时间没有数据传输的情况下,链路上的任何一个网关都可能关闭这个连接,而网关是我们不可控的,这就要求Comet连接必须定期发一些ping数据表示连接“正常工作”。

以上两种机制都治标不治本,所以,HTML5推出了WebSocket标准,让浏览器和服务器之间可以建立无限制的全双工通信,任何一方都可以主动发消息给对方。

3.WebSocket原理简析

  1. WebSocket协议与STOMP协议

    根据Spring-framework-reference的介绍,WebSocket协议定义了两种类型的消息(text and binary),但是这两种消息的content并没有定义。该协议定义了一种机制,供客户端和服务器协商在WebSocket之上使用子协议(即更高级别的消息协议),在子协议中定义可以发送的消息类型,格式,内容等。子协议的使用是可选的,但无论哪种方式,客户端和服务器都需要在使用哪种协议来定义消息内容上达成共识。

    最常用的子协议是STOMP(Simple Text Oriented Messageing Protocol),即面向文本的简单协议。在STOMP协议中,客户端可以使用SENDSUBSCRIBE命令发送或订阅消息,以及描述消息含义和接收者的Destination请求头。这启用了一种简单的发布-订阅机制,开发者可以使用该机制,通过代理将消息发送到其它已连接到服务器的客户端,或者将消息发送到服务器来请求执行某些操作。

    WebSocket订阅和发送请求消息

    destination请求头内容通常是类似路径的字符串,其中/ topic / …表示发布-订阅(一对多),而/ queue /表示点对点(一对一)消息交流。

  2. Spring中的WebSocket支持

    在使用Spring的STOMP支持时,Spring WebSocket应用程序将充当客户端的STOMP代理,客户端发送的消息会被路由到@Controller消息处理方法中,该代理跟踪订阅用户,在消息更新时,向订阅的用户广播消息。

  3. Spring支持整合专用的STOMP代理

    Spring还支持为消息广播配置专用的STOMP代理(RabbitMQ,ActiveMQ等),在这种情况下,Spring起到维护与代理的TCP连接,将消息中继到该代理,并将消息从该代理向下传递到已连接的WebSocket客户端的作用。

  4. 消息流

    • 启用简单内置消息代理时,使用的组件图:

    消息流工作图

    上图显示了三个消息通道:

    clientInboundChannel:用于传递从WebSocket客户端收到的消息。

    clientOutboundChannel:用于向WebSocket客户端发送服务器消息。

    brokerChannel:用于从服务器端应用程序代码内将消息发送到消息代理。

    • 将外部代理(例如RabbitMQ)配置为用于管理订阅和广播消息时使用的组件图准备另起一篇博客来写

4.SpringBoot整合WebSocket实现简单Web群聊

光说不练假把式,记录下自己写的一个小demo。

  1. 创建项目,添加Maven依赖

    由于是想要通过demo快速熟悉Springboot整合WebSocket,并没有进行前后端分离,前端采用html + jquery + SockJS + StompJS,所有JS依赖采用WebJars的方式引入。pom文件依赖如下:

     <dependencies>
         <dependency>
             <groupId>org.springframework.boot</groupId>
             <artifactId>spring-boot-starter-web</artifactId>
         </dependency>
         
         <dependency>
             <groupId>org.springframework.boot</groupId>
             <artifactId>spring-boot-starter-websocket</artifactId>
         </dependency>
    
         <dependency>
             <groupId>org.springframework.boot</groupId>
             <artifactId>spring-boot-starter-test</artifactId>
             <scope>test</scope>
             <exclusions>
                 <exclusion>
                     <groupId>org.junit.vintage</groupId>
                     <artifactId>junit-vintage-engine</artifactId>
                 </exclusion>
             </exclusions>
         </dependency>
    
         <dependency>
             <groupId>org.webjars</groupId>
             <artifactId>jquery</artifactId>
             <version>3.4.1</version>
         </dependency>
    
         <dependency>
             <groupId>org.webjars</groupId>
             <artifactId>stomp-websocket</artifactId>
             <version>2.3.3-1</version>
         </dependency>
    
         <dependency>
             <groupId>org.webjars</groupId>
             <artifactId>sockjs-client</artifactId>
             <version>1.1.2</version>
         </dependency>
    
         <!--Webjars版本定位工具(前端),用于省略版本号访问静态资源-->
         <dependency>
             <groupId>org.webjars</groupId>
             <artifactId>webjars-locator-core</artifactId>
         </dependency>
     </dependencies>
    
  2. 创建WebSocket配置类(重中之重,具体解释看代码注释)

    import org.springframework.context.annotation.Configuration;
    import org.springframework.messaging.simp.config.MessageBrokerRegistry;
    import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker;
    import org.springframework.web.socket.config.annotation.StompEndpointRegistry;
    import org.springframework.web.socket.config.annotation.WebSocketMessageBrokerConfigurer;
    
    /**
     * WebSocket配置类,实现WebSocketMessageBrokerConfigurer接口
     */
    @Configuration
    @EnableWebSocketMessageBroker
    public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {
         
        @Override
        public
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值