WebSocket 初试

首先请自行百度搭建一个简易的SpringMVC框架,maven引用:

<dependency>
  <groupId>org.springframework</groupId>
  <artifactId>spring-websocket</artifactId>
  <version>4.3.4.RELEASE</version>
</dependency>

创建 WebSocketHandler 的实现类:

@Component
public class SystemWebSocketHandler implements WebSocketHandler {

    private static final ArrayList<WebSocketSession> users = new ArrayList<>();

    @Override
    public void afterConnectionEstablished(WebSocketSession webSocketSession) throws Exception {
        users.add(webSocketSession);
        System.out.println("建立连接,当前在线用户的数量是:" + users.size());
    }

    @Override
    public void handleMessage(WebSocketSession webSocketSession, WebSocketMessage<?> webSocketMessage) throws Exception {
        System.out.println("收到消息:" + webSocketMessage.getPayload());
        TextMessage returnMessage = new TextMessage("服务器已收到消息");
        sendMessageToUsers(returnMessage);
    }

    @Override
    public void handleTransportError(WebSocketSession webSocketSession, Throwable throwable) throws Exception {
        if (webSocketSession.isOpen()) {
            webSocketSession.close();
        }
        users.remove(webSocketSession);
    }

    @Override
    public void afterConnectionClosed(WebSocketSession webSocketSession, CloseStatus closeStatus) throws Exception {
        users.remove(webSocketSession);
        System.out.println("关闭连接,当前在线用户的数量是:" + users.size());
    }

    @Override
    public boolean supportsPartialMessages() {
        return false;
    }

    /**
     * 给所有在线用户发送消息
     *
     * @param message TextMessage
     */
    private void sendMessageToUsers(TextMessage message) {
        for (WebSocketSession user : users) {
            if (user.isOpen()) {
                try {
                    user.sendMessage(message);
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }
    }
}

创建 WebSocketConfigurer 的实现类:

@Configuration
@EnableWebMvc
@EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {

    @Autowired
    SystemWebSocketHandler handler;

    @Override
    public void registerWebSocketHandlers(WebSocketHandlerRegistry webSocketHandlerRegistry) {
        webSocketHandlerRegistry.addHandler(handler, "/webSocketServer");
    }
}

创建 WebSocketController

@Controller
public class WebSocketController {

    @RequestMapping(value = "/websocket", method = RequestMethod.GET)
    public ModelAndView webSocket() {
        return new ModelAndView("websocket");
    }
}

最后创建websocket.html 页面:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>WebSocket 测试</title>
</head>
<script src="http://cdn.sockjs.org/sockjs-0.3.min.js"></script>
<script type="text/javascript">
    var websocket = null;

    //判断当前浏览器是否支持WebSocket
    if ('WebSocket' in window) {
        websocket = new WebSocket("ws://localhost:8080/webSocketServer");
    }
    else {
        alert('当前浏览器不支持WebSocket')
    }

    //连接发生错误的回调方法
    websocket.onerror = function () {
        setMessageInnerHTML("error");
    };

    //连接成功建立的回调方法
    websocket.onopen = function (event) {
        setMessageInnerHTML('当前状态' + event.type);
    };

    //接收到消息的回调方法
    websocket.onmessage = function (event) {
        setMessageInnerHTML('当前状态' + event.type);
        setMessageInnerHTML(event.data);
    };

    //连接关闭的回调方法
    websocket.onclose = function (event) {
        setMessageInnerHTML('当前状态' + event.type);
    };

    //监听窗口关闭事件,当窗口关闭时,主动去关闭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>
<body>
<h1>WebSocket 测试</h1>
<input title="message" id="text" type="text"/>
<button onclick="send()">发送</button>
<button onclick="closeWebSocket()">关闭</button>
<div id="message"></div>
</body>
</html>

启动程序,访问:http://localhost:8080/websocket

连接成功,状态为open

发送消息:


状态变为message,并打印出服务器发来的消息

打开一个新的会话页面,访问:http://localhost:8080/websocket 并发送消息

同上

关闭第二个会话页面,查看后台日志:


后台日志

参见:WebSocket与SpringMVC集成案例

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,991评论 19 139
  • Spring Boot 参考指南 介绍 转载自:https://www.gitbook.com/book/qbgb...
    毛宇鹏阅读 46,971评论 6 342
  • 凤栖梧桐金銮上,雨打芭蕉茅草房。 觥筹交错月影长,琵琶声远玉凝殇。
    善济会阅读 273评论 0 2
  • 有时候需要狠狠摔一跤,你才能知道你的位置。 世态炎凉,你以为你是谁 一只骆驼,辛辛苦苦穿过了沙漠,一只苍蝇趴在骆驼...
    邓锦瑶阅读 156评论 0 0
  • 《生理学》35分钟25页,理解率60% 现在看书会头疼,会不会跟大脑缺氧有关系呢?说了n遍要锻炼,一直没开始。时间...
    筱苏籽阅读 83评论 0 0