spring boot 集成 websocket 实现消息主动

前言

http协议是无状态协议，每次请求都不知道前面发生了什么，而且只可以由浏览器端请求服务器端，而不能由服务器去主动通知浏览器端，是单向的，在很多场景就不适合，比如实时的推送，消息通知或者股票等信息的推送；在没有 websocket 之前，要解决这种问题，只能依靠 ajax轮询 或者 长轮询，这两种方式极大的消耗资源；而websocket，只需要借助http协议进行握手，然后保持着一个websocket连接，直到客户端主动断开；相对另外的两种方式，websocket只进行一次连接，当有数据的时候再推送给浏览器，减少带宽的浪费和cpu的使用。
       WebSocket是html5新增加的一种通信协议，目前流行的浏览器都支持这个协议，例如Chrome，Safari，Firefox，Opera，IE等等，对该协议支持最早的应该是chrome，从chrome12就已经开始支持，随着协议草案的不断变化，各个浏览器对协议的实现也在不停的更新。该协议还是草案，没有成为标准，不过成为标准应该只是时间问题了，从WebSocket草案的提出到现在已经有十几个版本了，目前对该协议支持最完善的浏览器应该是chrome，毕竟WebSocket协议草案也是Google发布的，下面我们教程我们使用springboot 集成 websocket 实现消息的一对一以及全部通知功能。

本文使用spring boot 2.1.1+ jdk1.8 + idea。

一：引入依赖

如何创建springboot项目本文不再赘述，首先在创建好的项目pom.xml中引入如下依赖：

<!--引入websocket依赖 -->
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-websocket</artifactId>
</dependency>

<!--引入thymeleaf模板引擎依赖-->
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

二：创建websocket配置类

ServerEndpointExporter 会自动注册使用了@ServerEndpoint注解声明的Websocket endpoint。要注意，如果使用独立的servlet容器，而不是直接使用springboot的内置容器，就不要注入ServerEndpointExporter，因为它将由容器自己提供和管理。

package com.sailing.websocket.config;

import org.springframework.context.annotation.Bean;

import org.springframework.context.annotation.Configuration;

import org.springframework.web.socket.server.standard.ServerEndpointExporter;

/**

 * @author baibing

 * @project: springboot-socket

 * @package: com.sailing.websocket.config

 * @Description: socket配置类,往 spring 容器中注入ServerEndpointExporter实例

 * @date 2018/12/20 09：46

 */

@Configuration

public class WebSocketConfig {

    @Bean

    public ServerEndpointExporter serverEndpointExporter(){

        return new ServerEndpointExporter();

    }

}

三：编写websocket服务端代码

package com.sailing.websocket.common;

import org.springframework.stereotype.Component;

import javax.websocket.*;

import javax.websocket.server.PathParam;

import javax.websocket.server.ServerEndpoint;

import java.io.IOException;

import java.util.HashMap;

import java.util.Map;

import java.util.concurrent.atomic.AtomicInteger;

/**

 * @author baibing

 * @project: springboot-socket

 * @package: com.sailing.websocket.common

 * @Description: WebSocket服务端代码，包含接收消息，推送消息等接口

 * @date 2018/12/200948

 */

@Component

@ServerEndpoint(value = "/socket/{name}")

public class WebSocketServer {

    //静态变量，用来记录当前在线连接数。应该把它设计成线程安全的。

    private static AtomicInteger online = new AtomicInteger();

    //concurrent包的线程安全Set，用来存放每个客户端对应的WebSocketServer对象。

    private static Map<String,Session> sessionPools = new HashMap<>();

    /**

     * 发送消息方法

     * @param session 客户端与socket建立的会话

     * @param message 消息

     * @throws IOException

     */

    public void sendMessage(Session session, String message) throws IOException{

        if(session != null){

            session.getBasicRemote().sendText(message);

        }

    }

    /**

     * 连接建立成功调用

     * @param session 客户端与socket建立的会话

     * @param userName 客户端的userName

     */

    @OnOpen

    public void onOpen(Session session, @PathParam(value = "name") String userName){

        sessionPools.put(userName, session);

        addOnlineCount();

        System.out.println(userName + "加入webSocket！当前人数为" + online);

        try {

            sendMessage(session, "欢迎" + userName + "加入连接！");

        } catch (IOException e) {

            e.printStackTrace();

        }

    }

    /**

     * 关闭连接时调用

     * @param userName 关闭连接的客户端的姓名

     */

    @OnClose

    public void onClose(@PathParam(value = "name") String userName){

        sessionPools.remove(userName);

        subOnlineCount();

        System.out.println(userName + "断开webSocket连接！当前人数为" + online);

    }

    /**

     * 收到客户端消息时触发（群发）

     * @param message

     * @throws IOException

     */

    @OnMessage

    public void onMessage(String message) throws IOException{

        for (Session session: sessionPools.values()) {

            try {

                sendMessage(session, message);

            } catch(Exception e){

                e.printStackTrace();

                continue;

            }

        }

    }

    /**

     * 发生错误时候

     * @param session

     * @param throwable

     */

    @OnError

    public void onError(Session session, Throwable throwable){

        System.out.println("发生错误");

        throwable.printStackTrace();

    }

    /**

     * 给指定用户发送消息

     * @param userName 用户名

     * @param message 消息

     * @throws IOException

     */

    public void sendInfo(String userName, String message){

        Session session = sessionPools.get(userName);

        try {

            sendMessage(session, message);

        }catch (Exception e){

            e.printStackTrace();

        }

    }

    public static void addOnlineCount(){

        online.incrementAndGet();

    }

    public static void subOnlineCount() {

        online.decrementAndGet();

    }

}

四：增加测试页面路由配置类

如果为每一个页面写一个action太麻烦，spring boot 提供了页面路由的统一配置，在 spring boot 2.0 以前的版本中我们只需要继承 WebMvcConfigurerAdapter ，并重写它的 addViewControllers 方法即可，但是 2.0版本后 WebMvcConfigurerAdapter已经被废弃，使用 WebMvcConfigurer 接口代替（其实WebMvcConfigurerAdapter也是实现了WebMvcConfigurer），所以我们只需要实现它即可：

package com.sailing.websocket.config;

import org.springframework.context.annotation.Configuration;

import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;

import org.springframework.web.servlet.config.annotation.ViewControllerRegistry;

import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

/**

 * 在SpringBoot2.0及Spring 5.0 WebMvcConfigurerAdapter已被废弃，目前找到解决方案就有

 * 1 直接实现WebMvcConfigurer （官方推荐）

 * 2 直接继承WebMvcConfigurationSupport

 * @ https://blog.csdn.net/lenkvin/article/details/79482205

 */

@Configuration

public class WebMvcConfig implements WebMvcConfigurer {

    /**

     * 为各个页面提供路径映射

     * @param registry

     */

    @Override

    public void addViewControllers(ViewControllerRegistry registry) {

        registry.addViewController("/client").setViewName("client");

        registry.addViewController("/index").setViewName("index");

    }

}

五：创建测试页面

在 resources下面创建 templates 文件夹，编写两个测试页面 index.html 和 client.html 和上面配置类中的viewName相对应，两个页面内容一模一样，只是在连接websocket部分模拟的用户名不一样，一个叫 lucy 一个叫 lily ：

<!DOCTYPE HTML>

<html>

<head>

    <title>WebSocket</title>

</head>

<body>

Welcome<br/>

<input id="text" type="text" /><button onclick="send()">Send</button>    <button onclick="closeWebSocket()">Close</button>

<div id="message">

</div>

</body>

<script type="text/javascript">

    var websocket = null;

    //判断当前浏览器是否支持WebSocket

    if('WebSocket' in window){

        websocket = new WebSocket("ws://localhost:8080/socket/lucy");

    }else{

        alert('Not support websocket')

    }

    //连接发生错误的回调方法

    websocket.onerror = function(){

        setMessageInnerHTML("error");

    };

    //连接成功建立的回调方法

    websocket.onopen = function(event){

        setMessageInnerHTML("open");

    }

    //接收到消息的回调方法

    websocket.onmessage = function(event){

        setMessageInnerHTML(event.data);

    }

    //连接关闭的回调方法

    websocket.onclose = function(){

        setMessageInnerHTML("close");

    }

    //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。

    window.onbeforeunload = function(){

        websocket.close();

    }

    //将消息显示在网页上

    function setMessageInnerHTML(innerHTML){

        document.getElementById('message').innerHTML += innerHTML + '<br/>';

    }

    //关闭连接

    function closeWebSocket(){

        websocket.close();

    }

    //发送消息

    function send(){

        var message = document.getElementById('text').value;

        websocket.send(message);

    }

</script>

</html>
<!DOCTYPE HTML>

<html>

<head>

    <title>WebSocket</title>

</head>

<body>

Welcome<br/>

<input id="text" type="text" /><button onclick="send()">Send</button>    <button onclick="closeWebSocket()">Close</button>

<div id="message">

</div>

</body>

<script type="text/javascript">

    var websocket = null;

    //判断当前浏览器是否支持WebSocket

    if('WebSocket' in window){

        websocket = new WebSocket("ws://localhost:8080/socket/lily");

    }else{

        alert('Not support websocket')

    }

    //连接发生错误的回调方法

    websocket.onerror = function(){

        setMessageInnerHTML("error");

    };

    //连接成功建立的回调方法

    websocket.onopen = function(event){

        setMessageInnerHTML("open");

    }

    //接收到消息的回调方法

    websocket.onmessage = function(event){

        setMessageInnerHTML(event.data);

    }

    //连接关闭的回调方法

    websocket.onclose = function(){

        setMessageInnerHTML("close");

    }

    //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。

    window.onbeforeunload = function(){

        websocket.close();

    }

    //将消息显示在网页上

    function setMessageInnerHTML(innerHTML){

        document.getElementById('message').innerHTML += innerHTML + '<br/>';

    }

    //关闭连接

    function closeWebSocket(){

        websocket.close();

    }

    //发送消息

    function send(){

        var message = document.getElementById('text').value;

        websocket.send(message);

    }

</script>

</html>

六：测试webscoket controller

package com.sailing.websocket.controller;

import com.sailing.websocket.common.WebSocketServer;

import org.springframework.web.bind.annotation.RequestMapping;

import org.springframework.web.bind.annotation.RequestMethod;

import org.springframework.web.bind.annotation.RequestParam;

import org.springframework.web.bind.annotation.RestController;

import javax.annotation.Resource;

import java.io.IOException;

/**

 * @author baibing

 * @project: springboot-socket

 * @package: com.sailing.websocket.controller

 * @Description: websocket测试controller

 * @date 2018/12/20 10：11

 */

@RestController

public class SocketController {

    @Resource

    private WebSocketServer webSocketServer;

    /**

     * 给指定用户推送消息

     * @param userName 用户名

     * @param message 消息

     * @throws IOException

     */

    @RequestMapping(value = "/socket", method = RequestMethod.GET)

    public void testSocket1(@RequestParam String userName, @RequestParam String message){

        webSocketServer.sendInfo(userName, message);

    }

    /**

     * 给所有用户推送消息

     * @param message 消息

     * @throws IOException

     */

    @RequestMapping(value = "/socket/all", method = RequestMethod.GET)

    public void testSocket2(@RequestParam String message){

        try {

            webSocketServer.onMessage(message);

        } catch (IOException e) {

            e.printStackTrace();

        }

    }

}

七：测试

访问 http://localhost:8080/index 和 http://localhost:8080/client 分别打开两个页面并连接到websocket，http://localhost:8080/socket?userName=lily&message=helloworld 给lily发送消息，http://localhost:8080/socket/all?message=LOL 给全部在线用户发送消息：

最新文章

  1. 【C#】【Thread】CountdownEvent任务并行
  2. Nginx模块之————RTMP模块的FFmpeg的配置问题是FFmpeg的连续退出
  3. postgresql - 服务配置
  4. ets查询：查询表中的具体一列的所有值
  5. 关于SQL Server的WITH(NOLOCK)和(NOLOCK)
  6. ubuntu 安装compiz后 黑屏无法进入处理
  7. 学习c语言的第9天
  8. ***php解析html类库simple_html_dom
  9. MKMapView的内存释放问题
  10. Windows安装Subversion
  11. OJ常见问题及必须认识的对拍处理水题
  12. ajax传值
  13. 老生常谈--Js继承小结
  14. ASP.NET - Repeater控件删除按钮，点击删除信息
  15. 解决ruby安装后无法添加淘宝gem源------------学习记录
  16. 恢复oracle中误删除drop掉的表 闪回的方法
  17. Linux下配置yum源为阿里云或网易的详解
  18. 并发之AQS
  19. [Hive_11] Hive 的高级聚合函数
  20. P2922 [USACO08DEC]秘密消息Secret Message

热门文章

  1. Using Groovy To Import XML Into MongoDB
  2. linux管理权限
  3. fedora23深度配置gnome系统环境, 如设置ibus的面板字体大小 以及gedit 自动探测文件字符编码fileencodings
  4. 基于Skyline的web开发（6.x）
  5. loc() iloc() at() iat()函数
  6. Jmeter之JDBC--Mysql
  7. tensorflow 关于 矩阵 运算 + 符号得含义。 2维 数组 + 1纬数组， 就是每一行都 加一边 1纬数组。 呵呵
  8. 正则表达式——POSIX字符组
  9. 【HANA系列】SAP HANA快捷键大全
  10. Spring Boot 之 springcache的使用