Netty+SpringBoot+FastDFS+Html5實現聊天App詳解(一)

Netty+SpringBoot+FastDFS+Html5實現聊天App,項目介紹:https://segmentfault.com/a/11...javascript

Netty+SpringBoot+FastDFS+Html5實現聊天App,項目github連接:https://github.com/ShimmerPig...html

本章練習完整代碼連接:https://github.com/ShimmerPig...java

Netty學習

IO編程與NIO編程

傳統IO編程性能分析

IO編程模型在客戶端較少的狀況下運行良好,可是對於客戶端比較多的業務來講,單機服務端可能須要支撐成千上萬的鏈接,IO模型可能就不太合適了。這是由於在傳統的IO模型中,每一個鏈接建立成功以後都須要一個線程來維護,每一個線程包含一個while死循環,那麼1w個鏈接對應1w個線程,繼而1w個while死循環,這就帶來以下幾個問題:git

1.線程資源受限:線程是操做系統中很是寶貴的資源,同一時刻有大量的線程處於阻塞狀態是很是嚴重的資源浪費,操做系統耗不起。github

2.線程切換效率低下:單機cpu核數固定,線程爆炸以後操做系統頻繁進行線程切換,應用性能急劇降低。web

3.除了以上兩個問題,IO編程中,咱們看到數據讀寫是以字節流爲單位,效率不高。編程

爲了解決這三個問題,JDK在1.4以後提出了NIO。下面簡單描述一下NIO是如何解決以上三個問題的。segmentfault

線程資源受限

NIO編程模型中,新來一個鏈接再也不建立一個新的線程,而是能夠把這條鏈接直接綁定到某個固定的線程,而後這條鏈接全部的讀寫都由這個線程來負責。
這個過程的實現歸功於NIO模型中selector的做用,一條鏈接來了以後,如今不建立一個while死循環去監聽是否有數據可讀了,而是直接把這條鏈接註冊到selector上,而後,經過檢查這個selector,就能夠批量監測出有數據可讀的鏈接,進而讀取數據。瀏覽器

線程切換效率低下

因爲NIO模型中線程數量大大下降,線程切換效率所以也大幅度提升。服務器

IO讀寫以字節爲單位

NIO解決這個問題的方式是數據讀寫再也不以字節爲單位,而是以字節塊爲單位。IO模型中,每次都是從操做系統底層一個字節一個字節地讀取數據,而NIO維護一個緩衝區,每次能夠從這個緩衝區裏面讀取一塊的數據。




hello netty

完整代碼連接:https://github.com/ShimmerPig...

首先定義一對線程組——主線程bossGroup與從線程workerGroup。
bossGroup——用於接受客戶端的鏈接,可是不作任何處理,跟老闆同樣,不作事。
workerGroup——bossGroup會將任務丟給他,讓workerGroup去處理。

//主線程
EventLoopGroup bossGroup = new NioEventLoopGroup();
//從線程
EventLoopGroup workerGroup = new NioEventLoopGroup();

定義服務端的啓動類serverBootstrap,須要設置主從線程,NIO的雙向通道,與子處理器(用於處理workerGroup),這裏的子處理器後面咱們會手動建立。

// netty服務器的建立, ServerBootstrap 是一個啓動類
            ServerBootstrap serverBootstrap = new ServerBootstrap();
            serverBootstrap.group(bossGroup, workerGroup)            // 設置主從線程組
                            .channel(NioServerSocketChannel.class)    // 設置nio的雙向通道
                            .childHandler(new HelloServerInitializer()); // 子處理器,用於處理workerGroup

啓動服務端,綁定8088端口,同時設置啓動的方式爲同步的,這樣咱們的Netty就會一直等待,直到該端口啓動完畢。

ChannelFuture channelFuture = serverBootstrap.bind(8088).sync();

監聽關閉的通道channel,設置爲同步方式。

channelFuture.channel().closeFuture().sync();

將兩個線程優雅地關閉。

bossGroup.shutdownGracefully();
workerGroup.shutdownGracefully();

建立管道channel的子處理器HelloServerInitializer,用於處理workerGroup。
HelloServerInitializer裏面只重寫了initChannel方法,是一個初始化器,channel註冊後,會執行裏面相應的初始化方法。
在initChannel方法中經過SocketChannel得到對應的管道,經過該管道添加相關助手類handler。
HttpServerCodec是由netty本身提供的助手類,能夠理解爲攔截器,當請求到服務端,咱們須要作解碼,響應到客戶端作編碼。
添加自定義的助手類customHandler,返回"hello netty~"

ChannelPipeline pipeline = channel.pipeline();
pipeline.addLast("HttpServerCodec", new HttpServerCodec());
pipeline.addLast("customHandler", new CustomHandler());

建立自定義的助手類CustomHandler繼承SimpleChannelInboundHandler,返回hello netty~
重寫channelRead0方法,首先經過傳入的上下文對象ChannelHandlerContext獲取channel,若消息類型爲http請求,則構建一個內容爲"hello netty~"的http響應,經過上下文對象的writeAndFlush方法將響應刷到客戶端。

if (msg instanceof HttpRequest) {
    // 顯示客戶端的遠程地址
    System.out.println(channel.remoteAddress());
    
    // 定義發送的數據消息
    ByteBuf content = Unpooled.copiedBuffer("Hello netty~", CharsetUtil.UTF_8);
    
    // 構建一個http response
    FullHttpResponse response = 
        new DefaultFullHttpResponse(HttpVersion.HTTP_1_1, 
                HttpResponseStatus.OK, 
                content);
    // 爲響應增長數據類型和長度
    response.headers().set(HttpHeaderNames.CONTENT_TYPE, "text/plain");
    response.headers().set(HttpHeaderNames.CONTENT_LENGTH, content.readableBytes());
    
    // 把響應刷到客戶端
    ctx.writeAndFlush(response);
}

訪問8088端口,返回"hello netty~"
圖片描述




netty聊天小練習

完整代碼連接:https://github.com/ShimmerPig...

服務器

定義主從線程與服務端的啓動類

public class WSServer {

    public static void main(String[] args) throws Exception {
        
        EventLoopGroup mainGroup = new NioEventLoopGroup();
        EventLoopGroup subGroup = new NioEventLoopGroup();
        
        try {
            ServerBootstrap server = new ServerBootstrap();
            server.group(mainGroup, subGroup)
                .channel(NioServerSocketChannel.class)
                .childHandler(new WSServerInitialzer());
            
            ChannelFuture future = server.bind(8088).sync();
            
            future.channel().closeFuture().sync();
        } finally {
            mainGroup.shutdownGracefully();
            subGroup.shutdownGracefully();
        }
    }
    
}

建立channel的子處理器WSServerInitialzer
加入相關的助手類handler

public class WSServerInitialzer extends ChannelInitializer<SocketChannel> {

    @Override
    protected void initChannel(SocketChannel ch) throws Exception {
        ChannelPipeline pipeline = ch.pipeline();
        
        // websocket 基於http協議,因此要有http編解碼器
        pipeline.addLast(new HttpServerCodec());
        // 對寫大數據流的支持 
        pipeline.addLast(new ChunkedWriteHandler());
        // 對httpMessage進行聚合,聚合成FullHttpRequest或FullHttpResponse
        // 幾乎在netty中的編程,都會使用到此hanler
        pipeline.addLast(new HttpObjectAggregator(1024*64));
        
        // ====================== 以上是用於支持http協議    ======================
        
        // ====================== 如下是支持httpWebsocket ======================
        
        /**
         * websocket 服務器處理的協議,用於指定給客戶端鏈接訪問的路由 : /ws
         * 本handler會幫你處理一些繁重的複雜的事
         * 會幫你處理握手動做: handshaking(close, ping, pong) ping + pong = 心跳
         * 對於websocket來說,都是以frames進行傳輸的,不一樣的數據類型對應的frames也不一樣
         */
        pipeline.addLast(new WebSocketServerProtocolHandler("/ws"));
        
        // 自定義的handler
        pipeline.addLast(new ChatHandler());
    }

}

建立自定義的助手類ChatHandler,用於處理消息。
TextWebSocketFrame:在netty中,是用於爲websocket專門處理文本的對象,frame是消息的載體。
建立管道組ChannelGroup,用於管理全部客戶端的管道channel。

private static ChannelGroup clients = 
    new DefaultChannelGroup(GlobalEventExecutor.INSTANCE);

重寫channelRead0方法,經過傳入的TextWebSocketFrame獲取客戶端傳入的內容。經過循環的方法對ChannelGroup中全部的channel進行回覆。

@Override
protected void channelRead0(ChannelHandlerContext ctx, TextWebSocketFrame msg) 
throws Exception {
    // 獲取客戶端傳輸過來的消息
    String content = msg.text();
    System.out.println("接受到的數據:" + content);

//        for (Channel channel: clients) {
//            channel.writeAndFlush(
//                new TextWebSocketFrame(
//                        "[服務器在]" + LocalDateTime.now() 
//                        + "接受到消息, 消息爲:" + content));
//        }
    // 下面這個方法,和上面的for循環,一致
    clients.writeAndFlush(
    new TextWebSocketFrame(
            "[服務器在]" + LocalDateTime.now() 
            + "接受到消息, 消息爲:" + content));

}

重寫handlerAdded方法,當客戶端鏈接服務端以後(打開鏈接),獲取客戶端的channle,而且放到ChannelGroup中去進行管理。

@Override
public void handlerAdded(ChannelHandlerContext ctx) throws Exception {
    clients.add(ctx.channel());
}

重寫handlerRemoved方法,當觸發handlerRemoved,ChannelGroup會自動移除對應客戶端的channel。

@Override
public void handlerRemoved(ChannelHandlerContext ctx) throws Exception {
    // 當觸發handlerRemoved,ChannelGroup會自動移除對應客戶端的channel
    //        clients.remove(ctx.channel());
    System.out.println("客戶端斷開,channle對應的長id爲:" 
                + ctx.channel().id().asLongText());
    System.out.println("客戶端斷開,channle對應的短id爲:" 
                            + ctx.channel().id().asShortText());
}

客戶端

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
    </head>
    <body>
        
        <div>發送消息:</div>
        <input type="text" id="msgContent"/>
        <input type="button" value="點我發送" onclick="CHAT.chat()"/>
        
        <div>接受消息:</div>
        <div id="receiveMsg" style="background-color: gainsboro;"></div>
        
        <script type="application/javascript">
            
            window.CHAT = {
                socket: null,
                init: function() {
                    if (window.WebSocket) {
                        CHAT.socket = new WebSocket("ws://192.168.1.4:8088/ws");
                        CHAT.socket.onopen = function() {
                            console.log("鏈接創建成功...");
                        },
                        CHAT.socket.onclose = function() {
                            console.log("鏈接關閉...");
                        },
                        CHAT.socket.onerror = function() {
                            console.log("發生錯誤...");
                        },
                        CHAT.socket.onmessage = function(e) {
                            console.log("接受到消息:" + e.data);
                            var receiveMsg = document.getElementById("receiveMsg");
                            var html = receiveMsg.innerHTML;
                            receiveMsg.innerHTML = html + "<br/>" + e.data;
                        }
                    } else {
                        alert("瀏覽器不支持websocket協議...");
                    }
                },
                chat: function() {
                    var msg = document.getElementById("msgContent");
                    CHAT.socket.send(msg.value);
                }
            };
            
            CHAT.init();
            
        </script>
    </body>
</html>




測試

圖片描述

相關文章
相關標籤/搜索