netty之WebSocket 二进制消息

最新推荐文章于 2024-06-14 11:26:35 发布

weixin_34301132

最新推荐文章于 2024-06-14 11:26:35 发布

阅读量1.3k

点赞数

文章标签：网络 netty java

原文链接：https://my.oschina.net/u/2462659/blog/1615116

版权

本文探讨如何使用Netty实现WebSocket协议来处理客户端发送的二进制图片消息，服务端接收到图片后将其保存到本地，并且详细介绍了在需求二中，服务器如何将接收到的图片作为BinaryWebSocketFrame返回给特定客户端，以及客户端如何处理接收到的Blob对象。

摘要由CSDN通过智能技术生成

2019独角兽企业重金招聘Python工程师标准>>>

需求一: 客户端发送图片消息到服务端,服务端把图片保存到本地

客户端代码:

<html>
<head>
    <meta charset="utf-8">
    <title>Netty websocket 时间服务器</title>
</head>
<body>
<form action="" οnsubmit="return false;">
    <input type="text" name="message" value=""/>
    <input type="file" name="file"/>
    <br>
    <input type="button" value="send" value="发送websocket请求消息" οnclick="send(this.form.message.value);" />
    <hr color="blue">
    <h3>服务器返回信息</h3>
    <textarea id="responseText" rows="10" cols=""></textarea>
</form>
</body>

<script type="text/javascript">
    var socket;
    if(!window.WebSocket){
        window.WebSocket = window.MozWebSocket;
    }
    if(window.WebSocket){
        socket = new WebSocket("ws://localhost:7777/websocket");
        socket.onmessage = function(event){
            var ta = document.getElementById('responseText');
            ta.value="";
            ta.value=event.data;
        };
        socket.onopen = function(event){
            var ta = document.getElementById('responseText');
            ta.value = "打开websocket服务正常";
        }
        socket.onclose = function(event){
            var ta = document.getElementById('responseText');
            ta.value="";
            ta.value="websocket关闭";
        }
    }else{
        alert("对不起，您的浏览器不支持WebSocket.");
    }

    function send(message){

   var file = document.querySelector('input[type="file"]') .files[0];

        if(!window.WebSocket){
            return ;
        }
        if(socket.readyState == WebSocket.OPEN){
         socket.send(file);
        }else{
            alert("WebSocket 连接创建失败.");
        }
    }
</script>
</html>

服务端代码:

package demo1;

import io.netty.bootstrap.ServerBootstrap;
import io.netty.channel.ChannelFuture;
import io.netty.channel.ChannelInitializer;
import io.netty.channel.EventLoopGroup;
import io.netty.channel.nio.NioEventLoopGroup;
import io.netty.channel.socket.SocketChannel;
import io.netty.channel.socket.nio.NioServerSocketChannel;
import io.netty.handler.codec.http.HttpObjectAggregator;
import io.netty.handler.codec.http.HttpServerCodec;
import io.netty.handler.stream.ChunkedWriteHandler;

public class WebSocketServer {

    public void run(int port){
        EventLoopGroup bossGroup = new NioEventLoopGroup();
        EventLoopGroup workerGroup = new NioEventLoopGroup();
        try {
            ServerBootstrap b = new ServerBootstrap();
            b.group(bossGroup, workerGroup)
                    .channel(NioServerSocketChannel.class)
                    .childHandler(new ChannelInitializer<SocketChannel>() {
                        @Override
                        protected void initChannel(SocketChannel ch) throws Exception {
                            //HttpServerCodec将请求和应答消息编码或解码为HTTP消息
                            //通常接收到的http是一个片段，如果想要完整接受一次请求所有数据，我们需要绑定HttpObjectAggregator
                            //然后就可以收到一个FullHttpRequest完整的请求信息了
                            //ChunkedWriteHandler 向客户端发送HTML5文件，主要用于支持浏览器和服务器进行WebSocket通信
                            //WebSocketServerHandler自定义Handler
                            ch.pipeline()
                                    .addLast("http-codec", new HttpServerCodec())
                                    .addLast("aggregator", new HttpObjectAggregator(65536)) //定义缓冲大小