SpringBoot教程----整合WebSocket

最新推荐文章于 2024-05-23 10:50:00 发布

Dormiveglia-flx

最新推荐文章于 2024-05-23 10:50:00 发布

阅读量374

点赞数

分类专栏：后端Spring系列文章标签： java spring boot 网络协议 websocket 网络

本文链接：https://blog.csdn.net/sugerfle/article/details/123256324

版权

后端Spring系列专栏收录该内容

18 篇文章 0 订阅

订阅专栏

SpringBoot教程----整合WebSocket

- 什么是WebSocket？WebSocket有那些应用场景？
- WebSocket demo————以弹幕为例

什么是WebSocket？WebSocket有那些应用场景？

概念：浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送

常见的应用场景:
1.社交聊天
最著名的就是微信，QQ，这一类社交聊天的app。这一类聊天app的特点是低延迟，高即时。

2.弹幕
说到这里，大家一定里面想到了A站和B站了。确实，他们的弹幕一直是一种特色。而且弹幕对于一个视频来说，很可能弹幕才是精华。发弹幕需要实时显示，也需要和聊天一样，需要即时。

WebSocket demo————以弹幕为例

前端代码如下：

<!DOCTYPE HTML>
<html>
<head>
<title>My WebSocket</title>
</head>

<body>
    <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:8082/test/bulletChat");
    } 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>

后端代码如下：
此处省略Springboot集成WebSocket的环境搭建

	/**
     * 弹幕
     */
    private String bulletChatMsg;

    /**
     * socket会话。
     */
    private Session session;

    /**
     * 存放websocket对象
     * 每当客户端与服务器端建立socket链接以后，webSocketSet添加链接数据
     */
    private static CopyOnWriteArraySet<WebSocketServerService> webSocketSet = new CopyOnWriteArraySet<>();


    /**
     * 建立会话
     *
     * @param session  会话
     * @param nickName 昵称
     */
    @OnOpen
    public void onOpen(Session session, String bulletChatMsg) {
        JSONObject msg = new JSONObject();
        // session链接
        this.session = session;
        // 向webSocketSet中添加消息，用于记录整体的链接数
        webSocketSet.add(this);
        log.info("加入连接，当前在线有{}人",webSocketSet.size());
    }

    /**
     * 关闭连接
     */
    @OnClose
    public void onClose() throws IOException {
        //从set中删除
        webSocketSet.remove(this);
        log.info("当前在线人数，剩余{}人",  webSocketSet.size());
    }

    @OnMessage
    public void OnMessage(Session session, String bulletChatMsg) {
            //发送弹幕
            broadcast(bulletChatMsg);
        }
    }

    /**
     * 发生错误时调用   
     */
    @OnError
    public void onError(Session session, Throwable error) {
        log.error("发生错误,用户：{}，发生错误", session.getId());
        error.printStackTrace();
    }

    /**
     * 发送弹幕
     */
    public void broadcast(String message) {
        webSocketSet.forEach(item -> {
            try {
                if (item.session.isOpen()){
                    item.session.getBasicRemote().sendText(message);
                }
            } catch (IOException e) {
                e.printStackTrace();
            }
        });
    }

Dormiveglia-flx

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
SpringBoot教程----整合WebSocket

SpringBoot教程----整合WebSocket什么是WebSocket？WebSocket有那些应用场景？WebSocket demo————以弹幕为例什么是WebSocket？WebSocket有那些应用场景？概念：浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送常见的应用场景:1.社交聊天最著名的就是微信，QQ，这一类社交聊天的app。这一类聊天app的特点是低延迟，高即时。2.弹幕说到这里，大家一定里面想到了A
复制链接

扫一扫

专栏目录