WebSocket是基于HTML5标准的TCP协议,有点像HTTP,但是它在浏览器和Server之间实现了类似TCP的全双工通信,基于持久连接优于HTTP实现BS方式即时相互通信。在Tomcat7中实现了WebSocket,J2EE7(Servlet3.0)中也实现了WebSocket。
记录一下 Java Web服务端和javascript html客户端实现WebSocket:
1,环境
tomcat7.0.68,
JDK1.7,
WebAPP Server Servlet3.0
js websocket client library:socket.io-1.4.5.js
2,实现服务端
Annotated Endpoints方式:
这种方式配置实现一个ServerEndpoint就行了
package merrick.websocket; import java.net.InetAddress; import java.net.URI; import java.util.Date; import javax.websocket.CloseReason; import javax.websocket.EndpointConfig; import javax.websocket.OnClose; import javax.websocket.OnError; import javax.websocket.OnMessage; import javax.websocket.OnOpen; import javax.websocket.Session; import javax.websocket.server.ServerEndpoint; @ServerEndpoint(value = "/service1") public class WS1 { @OnOpen public void onOpen(Session session, EndpointConfig conf){<span style="font-family:Arial;">//建立</span> URI u = session.getRequestURI(); System.out.println(new Date().toString()+", connected: " + session.getRequestURI().toString()+" , info: " ); } @OnMessage public void onMessage(Session ss, String msg){//收到客户端消息 try { InetAddress adr = InetAddress.getLocalHost(); String localip = adr.getHostAddress().toString(); System.out.println(new Date().toString()+", received: " + msg); ss.getBasicRemote().sendText("["+ new Date().toLocaleString()+"][WS1:_1,"+localip+"] "+msg); for (int i = 0; i < 4; i++) { Thread.currentThread().sleep(5000); ss.getBasicRemote().sendText("["+ new Date().toLocaleString()+"][WS1:_"+ String.valueOf(i+2) +","+localip+"] "+msg); } } catch (Exception e) { e.printStackTrace(); } } @OnError public void onError(Session session, Throwable error){// URI u = session.getRequestURI(); System.out.println(new Date().toString()+", error: " + session.getRequestURI().toString()+" , info: " + u.getUserInfo());//null info } @OnClose public void onClose(Session ss, CloseReason rz){//连接关闭 URI u = ss.getRequestURI(); System.out.println(new Date().toString()+", closed: " + ss.getRequestURI().toString()+" , info: " + u.getUserInfo());//null info } }
PROGRAMMATIC EndPoints方式:
这种方式需要实现ServerApplicationConfig接口,并在重写方法中加载ServerEndpointConfig,
package merrick.websocket; import java.net.InetAddress; import java.util.Date; import javax.websocket.CloseReason; import javax.websocket.Endpoint; import javax.websocket.EndpointConfig; import javax.websocket.MessageHandler; import javax.websocket.Session; import org.apache.log4j.Logger; public class WS2 extends Endpoint { private static Logger log = Logger.getLogger(WS2.class); @Override public void onOpen(final Session ss, EndpointConfig arg1) { System.out.println(new Date().toString()+", connected: " + ss.getRequestURI().toString()+" , info: " ); ss.addMessageHandler(new MessageHandler.Whole<String>() { @Override public void onMessage(String msg) { try { InetAddress adr = InetAddress.getLocalHost(); String localip = adr.getHostAddress().toString(); String s = new Date().toString()+", received: " + msg; log.info(s); System.out.println(s); ss.getBasicRemote().sendText("[WS2: ]"+msg); for (int i = 0; i < 4; i++) { Thread.currentThread().sleep(5000); String s2 = "["+ new Date().toLocaleString()+"][WS2:_"+ String.valueOf(i+2) +","+localip+"] "+msg ; ss.getBasicRemote().sendText(s2); log.info("Reply: "+s2); } } catch (Exception e) { e.printStackTrace(); } } }); } @Override public void onClose(Session session, CloseReason closeReason) { // TODO Auto-generated method stub super.onClose(session, closeReason); } @Override public void onError(Session session, Throwable throwable) { // TODO Auto-generated method stub System.out.println(throwable.toString()); super.onError(session, throwable); } }
package merrick.websocket; import java.util.HashSet; import java.util.Set; import javax.websocket.Endpoint; import javax.websocket.server.ServerApplicationConfig; import javax.websocket.server.ServerEndpointConfig; import org.apache.log4j.Logger; public class WS2ApplicationConfig implements ServerApplicationConfig { private static Logger log = Logger.getLogger(WS2ApplicationConfig.class); @Override public Set<Class<?>> getAnnotatedEndpointClasses(Set<Class<?>> arg0) { // TODO Auto-generated method stub log.info("getAnnotatedEndpointClasses"); return arg0; } @Override public Set<ServerEndpointConfig> getEndpointConfigs(Set<Class<? extends Endpoint>> arg0) { // TODO Auto-generated method stub Set<ServerEndpointConfig> ec = new HashSet<ServerEndpointConfig>(); ec.add(ServerEndpointConfig.Builder.create(merrick.websocket.WS2.class, "/service2").build());//加载Endpoint服务类 /** * annotation方式继承Endpoint类无需手动在此ServerApplicationConfig中加载,并且不需要实现ServerApplicationConfig接口 * * */ log.info("getEndpointConfigs"); return ec; } }
3,实现Web客户端
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="socket.io-1.4.5.js"></script> <script type="text/javascript" src="jquery-1.9.1.js"></script> <script type="text/javascript"> $(document).ready(function(){ //等于$(function(){}); // var ws = new WebSocket("ws://192.168.245.133:8080/websocketservertest1/service1"); //ws://<ip>:<port>/<projectname>/<endpointpath> var ws = new WebSocket("ws://localhost:8080/websocketservertest1/service2"); ws.onopen = function(){ws.send("Test!"+new Date().getSeconds()); }; ws.onmessage = function(evt){ console.log(evt.data); $("#datadiv").append("<br/>"+evt.data); // alert(evt.data); // ws.close(); }; ws.onclose = function(evt){console.log("WebSocketClosed!");alert("closed");}; ws.onerror = function(evt){console.log("WebSocketError!");alert("error");}; }); </script> </head> <body> <div id="datadiv"></div> </body> </html>
4,测试
比如测试/service2的时候在页面上会出现如下定时响应展现:
[WS2: ]Test!15
[2016-10-10 14:49:20][WS2:_2,<ip>] Test!15
[2016-10-10 14:49:25][WS2:_3,<ip>] Test!15
[2016-10-10 14:49:30][WS2:_4,<ip>] Test!15
[2016-10-10 14:49:35][WS2:_5,<ip>] Test!15
相关推荐
websocket简单实现,能够对websocket进行一些实现,对初学websocket的人有一定好处。
通过调用webSocketSev类的方法,指定用户名,实现指定用户发送消息和群发消息
这是一个简单使用websocket实现多人聊天室,单人聊天室的demo,里面使用的是最原始的websocket的方法,附有客户端界面可以直接跑起来发送消息看效果。 该项目对应刚刚接触websocket技术是比较有用的。 2019-10-11的...
这个代码例子使用了c c++实现了websocket 开发 包含了websocket服务器和websocket客户端,拥有详细的解释 这个库比libwebsocket更加简单方便,比libsocket更加高效便捷.
webSocket实现Android客户端之间简单的通讯,或者群发
该资源用C语言实现的简易websocket测试程序,并附有web端的html页面辅助调试,供websocket学习者下载使用,理解websocket协议
springboot集成websocket实现聊天室功能(可多人聊天和单独聊天)
5WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。...
websocket demo 简单实现
本资源提供了简单的webScoket实现方式,使用工具为Eclipse,基于Tomcate7.0以上
利用websocket实现简单的外网映射工具,便于日常调试接口
应读者要求 写个了一个简单地springboot+websocket实现进度条的demo。
WebSocket的两种简单实现Demo,HTML5与STOMP实现方式,演示框架Spring Boot
WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。
首先,我需要用到node的nodejs-websocket模块 使用yarn进行安装 yarn add nodejs-websocket –save 当然,你也可以用npm进行安装 npm i nodejs-websocket –save 安装完毕之后,我们开始写服务端的代码,首先,...
用jetty8.0写的websocket实现的简单聊天程序,供大家一起共同分享学习。
本项目为spring-boot+webSocket实现的向日葵远程控制项目 向日葵是一款很好用的远程操作软件。 一直很好奇这种软件的基本原理是如何的? 今天带大家通过一个简单的项目来探究一下,并实现一个简单的远程操控软件 ...
springboot集成websocket实现即时通信,你发的消息将直接显示在另一台pc机的浏览器上
nodejs+websocket实现简单的多人聊天