深圳外贸网站建设制作方法,设计公司做网站价格,网站开发协助方案,沧州小程序开发制作目录
一、介绍
二、依赖导入
三、基础类准备
四、Handler实现
五、WebSocketChannelInitializer实现
六、WebSocketServer实现
七、前端实现
八、测试
九、参考链接 一、介绍
关于WebSocket此处不进行过多介绍#xff0c;本章主要着重通过Netty实现WebSocket通信服务…目录
一、介绍
二、依赖导入
三、基础类准备
四、Handler实现
五、WebSocketChannelInitializer实现
六、WebSocketServer实现
七、前端实现
八、测试
九、参考链接 一、介绍
关于WebSocket此处不进行过多介绍本章主要着重通过Netty实现WebSocket通信服务端并且实现一个简单的通过网页进行聊天的功能。
讲到WebSocket这里简单介绍一下为什么要使用WebSocket。以往我们通过网页与服务器进行交互时都是通过发起一个http/https请求该请求是无状态的发送请求后等待获取服务器返回的结果之后这次请求就结束了客户端与服务端就断开了。如果此时服务端想向客户端推送消息的话由于连接已经断开服务端无法进行消息推送此时可以通过使用WebSocket进行客户端与服务端建立长连接当服务端想向客户端推送消息时就可以向客户端进行消息推送了。 接下来就进行代码实现。 二、依赖导入
dependenciesdependencygroupIdio.netty/groupIdartifactIdnetty-all/artifactIdversion4.1.101.Final/version/dependency!--添加tomcat依赖模块.--dependencygroupIdorg.springframework.boot/groupIdartifactIdspring-boot-starter-tomcat/artifactIdversion2.0.4.RELEASE/version/dependencydependencygroupIdcom.alibaba.fastjson2/groupIdartifactIdfastjson2/artifactIdversion2.0.41/version/dependencydependencygroupIdorg.projectlombok/groupIdartifactIdlombok/artifactIdversion1.18.30/version/dependency/dependencies 三、基础类准备
1、ChannelManager 用于管理Channel等相关信息
public class ChannelManager {public final static ChannelGroup channelGroup new DefaultChannelGroup(GlobalEventExecutor.INSTANCE);public final static MapChannel, WebSocketServerHandshaker handShakerMap new ConcurrentHashMap();}2、WebSocketRequestMessage用于将客户端传递过来的json字符串转换该类的对象
Data
ToString
public class WebSocketRequestMessage {public String user;public String type;public String message;} 3、WebSocketResponseMessage用于返回给客户端的类型数据
public class WebSocketResponseMessage {public String user;public String type;public String message;public String date;public WebSocketResponseMessage(WebSocketRequestMessage webSocketRequestMessage) {this.user webSocketRequestMessage.getUser();this.type webSocketRequestMessage.getType();this.message webSocketRequestMessage.getMessage();this.date new Date().toString();}} 四、Handler实现
建立WebSocket通信时第一次发送的就是http请求进行协议升级为WebSocket需要实现针对该连接请求进行处理的handler协议升级成功之后后续发送的消息是数据帧消息将由WebSocketFrame相关的Handler进行处理为了方便理解此处简单画个图 1、DefaultHandler 抽象类重写一些基础的方法处理触发的事件、建立连接、断开连接、遗异常处理的供其他Handler继承其他Handler则无需实现上述功能
public abstract class DefaultHandlerT extends SimpleChannelInboundHandlerT {// 配合心跳使用由客户端进行发送心跳数据包Overridepublic void userEventTriggered(ChannelHandlerContext ctx, Object evt) throws Exception {if (evt instanceof IdleStateEvent) {IdleStateEvent idleStateEvent (IdleStateEvent) evt;// 触发读空闲 关闭客户端if(idleStateEvent.state().equals(IdleState.READER_IDLE)) {System.out.println(触发读空闲关闭channel);// 将消息传递CloseWebSocketFrame进行处理CloseWebSocketFrame closeWebSocketFrame new CloseWebSocketFrame();ctx.fireChannelRead(closeWebSocketFrame);}}}Overridepublic void channelActive(ChannelHandlerContext ctx) throws Exception {System.out.println(与客户端建立连接 ctx.channel());ChannelManager.channelGroup.add(ctx.channel());}Overridepublic void channelInactive(ChannelHandlerContext ctx) throws Exception {System.out.println(与客户端断开连接 ctx.channel());ChannelManager.channelGroup.remove(ctx.channel());}Overridepublic void exceptionCaught(ChannelHandlerContext ctx, Throwable cause) throws Exception {cause.printStackTrace();System.out.println(发生异常 ctx.channel());}} 2、FullHttpRequestHander
public class FullHttpRequestHandler extends DefaultHandlerFullHttpRequest {private WebSocketServerHandshaker handShaker;Overrideprotected void channelRead0(ChannelHandlerContext ctx, FullHttpRequest httpRequest) throws Exception {System.out.println(客户端消息 httpRequest);if(httpRequest.decoderResult().isFailure() || !websocket.equals(httpRequest.headers().get(HttpHeaderValues.UPGRADE))) {DefaultFullHttpResponse httpResponse new DefaultFullHttpResponse(HttpVersion.HTTP_1_1, HttpResponseStatus.BAD_REQUEST);ctx.writeAndFlush(httpResponse);return;}WebSocketServerHandshakerFactory webSocketServerHandshakerFactory new WebSocketServerHandshakerFactory(ws:/ ctx.channel() /websocket, null, false);handShaker webSocketServerHandshakerFactory.newHandshaker(httpRequest);if (null handShaker) {WebSocketServerHandshakerFactory.sendUnsupportedVersionResponse(ctx.channel());} else {// 在此处为channel添加WebSocketFrameEncoder和WebSocketFrameDecoderhandShaker.handshake(ctx.channel(), httpRequest);}ChannelManager.handShakerMap.put(ctx.channel(), handShaker);}} 3、TextWebSocketFrameHandler当WebSocket通信建立成功之后在此阶段发送的文本消息在该handler中进行处理如果发送的是二进制流那么请自己自行实现一个处理BinaryWebSocketFrame类型数据的Handler
public class TextWebSocketFrameHandler extends DefaultHandlerTextWebSocketFrame {Overrideprotected void channelRead0(ChannelHandlerContext ctx, TextWebSocketFrame msg) throws Exception {WebSocketRequestMessage webSocketRequestMessage JSON.parseObject(msg.text(), WebSocketRequestMessage.class);if(ping.equals(webSocketRequestMessage.getType())) {System.out.println(ping message);return;}System.out.println(ctx.channel() , 客户端消息 msg);WebSocketResponseMessage webSocketResponseMessage new WebSocketResponseMessage(webSocketRequestMessage);TextWebSocketFrame textWebSocketFrame new TextWebSocketFrame(JSON.toJSONString(webSocketResponseMessage));ChannelManager.channelGroup.writeAndFlush(textWebSocketFrame);}
} 4、CloseWebSocketFrameHandler客户端进行关闭时将通过该Handler进行处理
public class CloseWebSocketFrameHandler extends DefaultHandlerCloseWebSocketFrame {Overrideprotected void channelRead0(ChannelHandlerContext ctx, CloseWebSocketFrame msg) throws Exception {System.out.println(客户端要断开);WebSocketServerHandshaker handShaker ChannelManager.handShakerMap.get(ctx.channel());handShaker.close(ctx.channel(), msg.retain());}} 五、WebSocketChannelInitializer实现
public class WebSocketChannelInitializer extends ChannelInitializerSocketChannel {Overrideprotected void initChannel(SocketChannel socketChannel) throws Exception {ChannelPipeline pipeline socketChannel.pipeline();// 将建立连接时发送的第一次http请求数据装换为转换为 HttpRequestpipeline.addLast(new HttpServerCodec());// 将拆分的http消息请求内容、请求体聚合成一个消息pipeline.addLast(new HttpObjectAggregator(65536));// 块写出pipeline.addLast(new ChunkedWriteHandler());// 配置读空闲Handler 3秒该Channel没有产生读将会触发读空闲事件pipeline.addLast(new IdleStateHandler(3, 0, 0));pipeline.addLast(new FullHttpRequestHandler());pipeline.addLast(new TextWebSocketFrameHandler());pipeline.addLast(new CloseWebSocketFrameHandler());}} 六、WebSocketServer实现
public class WebSocketServer {public void bind(Integer port) {EventLoopGroup parent new NioEventLoopGroup();EventLoopGroup child new NioEventLoopGroup();try {ServerBootstrap serverBootstrap new ServerBootstrap();serverBootstrap.group(parent, child).channel(NioServerSocketChannel.class).option(ChannelOption.SO_BACKLOG, 1024).childHandler(new WebSocketChannelInitializer());ChannelFuture channelFuture serverBootstrap.bind(port).sync();System.out.println(web socket server 启动成功...);channelFuture.channel().closeFuture().sync();} catch (Exception e) {e.printStackTrace();} finally {parent.shutdownGracefully();child.shutdownGracefully();}}} 七、前端实现
接下来写一个简单的前端web页无须引入框架只需要使用原生HTML5和JavaScript即可。
!DOCTYPE html
htmlheadmeta charsetutf-8title/title/headbodybutton id login-btn onclicklogin()登录/buttonbutton id logout-btn onclicklogout()退出/buttonbr/p idconnection-status连接状态关闭/pp idusername-taguser:/pinput idsend-msg-box typetext/button onclicksend()发送/buttonp群发消息/ptextarea idmsg-box/textarea /bodyscriptvar socket;var user;function login() {if (window.WebSocket){socket new WebSocket(ws://localhost:8888/websocket);socket.onerror function(event) {document.getElementById(connection-status).innerHTML 连接状态异常;document.getElementById(channel-tag).innerHTML channel:;}socket.onopen function(event) {document.getElementById(connection-status).innerHTML 连接状态正常;var max 999var min 100user admin (Math.floor(Math.random() * (max - min 1)) min)document.getElementById(username-tag).innerHTML user: user;// 每隔 2 秒钟发送一次 Ping 帧setInterval(function() {if (socket.readyState socket.OPEN) {var pingMessage {type: ping,message: }socket.send(JSON.stringify(pingMessage))}}, 2000);}socket.onclose function(event){document.getElementById(connection-status).innerHTML 连接状态关闭;document.getElementById(username-tag).innerHTML user:}socket.onmessage function(event){var message document.getElementById(msg-box).value;var response JSON.parse(event.data)message message \n response.date response.user response.message;document.getElementById(msg-box).value message;}} else {alter(不支持websocket)}}function send() {if(socket null) {alert(连接未建立)return;}if (socket.readyState WebSocket.OPEN) {var value document.getElementById(send-msg-box).value;var textMessage {type: text,user: user,message: value}//alert(message);//console.log(message)socket.send(JSON.stringify(textMessage));} else {alert(连接未建立)}}function logout() {if(socket null) {alert(连接未建立)return;}if (socket.readyState WebSocket.OPEN) {socket.close();} else {alert(连接未建立)}}/script/html八、测试
1、启动服务端
new WebSocketServer().bind(8888);
控制台打印如下信息
web socket server 启动成功... 2、打开两个web页分别进行登录点击
点击登录之后可以看到连接状态正常以及随机分配了一个用户名 3、发送消息
在任一客户端进行消息发送都能在所有客户端聊天框中看到如图信息: 4、关闭客户端可手动点击关闭按钮或则通过关闭网页以及浏览器即可断开连接 九、参考链接
JS实时通信三把斧系列之一: websocket - 知乎
