zoukankan      html  css  js  c++  java
  • WebSoket的简单用法

    第一步,在客户端配置

    <script>
        var websocket;
        if ('WebSocket' in window) {
            websocket = new WebSocket('ws://127.0.0.1:8080/websocket');//配置Websocket服务器端地址
        } else {
            alert("你的浏览器暂不支持websocket,请更换其他浏览器再试");
        }
    
        websocket.onopen = function (event) {
            console.log("建立连接");
        };
        websocket.onclose = function (event) {
            console.log("关闭连接");
        };
        websocket.onmessage = function (event) {
            console.log("收到消息," + event.data);
            // 弹窗提示与播放提示音乐
            var msg = event.data;
            if (msg === "秒杀已结束") {
                $('#seckill-box').html("秒杀结束");
            }
        };
        websocket.onerror = function (event) {
            console.log("websocket异常");
        };
        /**
         * readyState状态如下:
         * CONNECTING:值为0,表示正在连接;
         OPEN:值为1,表示连接成功,可以通信了;
         CLOSING:值为2,表示连接正在关闭;
         CLOSED:值为3,表示连接已经关闭,或者打开连接失败。
         */
    
        // 向服务端发送消息(必须为open状态时可发送)
        if (websocket.readyState === 1) {
            websocket.send("服务端你好");
        }
    
    </script>

    第二步,在服务端配置

    @Configuration
    public class WebSocketConfig {
    
        @Bean
        public ServerEndpointExporter serverEndpointExporter() {
            return new ServerEndpointExporter();
        }
    
    }
    @ServerEndpoint("/websocket")
    @Component
    @Slf4j
    public class WebSocketService {
    
        /**
         * 记录当前websocket的连接数(保证线程安全)
         */
        private static LongAdder connectAccount = new LongAdder();
    
        /**
         *存放每个客户端对应的websocketServer对象(需保证线程安全)
         */
        private static CopyOnWriteArraySet<WebSocketService> webSocketSet = new CopyOnWriteArraySet<>();
        /**
         * 与客户端的连接对象
         */
        private Session session;
    
        /**
         * 连接成功调用的方法
         * @param session
         */
        @OnOpen
        public void onOpen(Session session) {
            this.session = session;
            webSocketSet.add(this);
            connectAccount.increment();
            log.info("有新的连接接入,当前连接数为{}", connectAccount);
        }
    
        /**
         * 连接关闭时调用
         */
        @OnClose
        public void onClose() {
            webSocketSet.remove(this);
            connectAccount.decrement();
            log.info("有连接关闭,当前连接数为{}", connectAccount);
        }
    
        /**
         * 收到客户端消息时调用
         * @param message
         */
        @OnMessage
        public void onMessage(String message) {
            log.info("收到客户端发来的消息,message -> {}", message);
        }
    
        /**
         * 服务端向客户端发送消息
         * @param message
         */
        public void sendMessage(String message) {
            for (WebSocketService webSocketService : webSocketSet) {
                try {
                    log.info("【websocket消息】 广播消息, message={}", message);
                    webSocketService.session.getBasicRemote().sendText(message);
                } catch (IOException e) {
                    log.info("向客户端发送消息失败, {}", e.getMessage());
                }
            }
        }
    
    }

    之后就可以在你需要推送消息的地方调用WebSocketService服务了。

  • 相关阅读:
    浅拷贝与深拷贝
    省市县三级异步加载导航
    数据处理为树形结构以及多级菜单的逻辑分析
    九宫格
    数组及字符串方法
    定时器
    js,ajax获取数据
    js去重
    js常见排序
    SSH+DWZ、JQuery-UI ,swfobject.embedSWF属性与用法,IE下日期控件被flash控件挡住
  • 原文地址:https://www.cnblogs.com/panbingqi/p/11357069.html
Copyright © 2011-2022 走看看