websocket在web项目中的使用

websocket可以和服务器建立持久的连接,依靠事件去推动

客户端代码:

  

<%@ page language="java" pageEncoding="UTF-8" %> <!DOCTYPE html> <html> <head> <title>Java后端WebSocket的Tomcat实现</title> </head> <body> Welcome<br/><input type="text"/> <button>发送消息</button> <hr/> <button>关闭WebSocket连接</button> <hr/> <div></div> </body> <script type="text/javascript"> var websocket = null; //判断当前浏览器是否支持WebSocket if (\'WebSocket\' in window) { websocket = new WebSocket("ws://localhost:8080/test/websocket"); } else { alert(\'当前浏览器 Not support websocket\') } //连接发生错误的回调方法 websocket.onerror = function () { setMessageInnerHTML("WebSocket连接发生错误"); }; //连接成功建立的回调方法 websocket.onopen = function () { setMessageInnerHTML("WebSocket连接成功"); } //接收到消息的回调方法 websocket.onmessage = function (event) { setMessageInnerHTML(event.data); } //连接关闭的回调方法 websocket.onclose = function () { setMessageInnerHTML("WebSocket连接关闭"); } //监听窗口关闭事件,当窗口关闭时,主动去关闭websocket连接,防止连接还没断开就关闭窗口,server端会抛异常。 window.onbeforeunload = function () { closeWebSocket(); } //将消息显示在网页上 function setMessageInnerHTML(innerHTML) { document.getElementById(\'message\').innerHTML += innerHTML + \'<br/>\'; } //关闭WebSocket连接 function closeWebSocket() { websocket.close(); } //发送消息 function send() { var message = document.getElementById(\'text\').value; websocket.send(message); } </script> </html>

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zzdwww.html