java 簡單仿微信聊天(springboot)

源碼免費下載地址：關注微信公衆號“蝦米聊吧”，回覆關鍵字“仿微信聊天”

 

採用springboot netty 簡單模仿微信聊天界面和功能。

系統模塊：包括手機app端，後臺服務端

技術架構：

手機app：Html5+，開發工具HBuilderX

後臺服務：springboot + netty + mybatis ，開發工具IDEA

實現功能：用戶註冊、登錄、用戶主頁（頭像展示上傳下載、暱稱、賬號、個人二維碼生成展現、退出登錄）、發現頁面（朋友圈、添加好友、掃一掃）、通訊錄、聊天功能等。

系統效果圖如下：

1.首先是夜神模擬器模擬的安卓手機效果：

界面效果如下：

                   

 

IPhone 5s真機效果圖如下：

         

項目結構如下

前端項目結構：

 

後端項目結構如下：

 websocket服務主類：

package com.wechat.netty;

import org.springframework.stereotype.Component;

import io.netty.bootstrap.ServerBootstrap;
import io.netty.channel.ChannelFuture;
import io.netty.channel.EventLoopGroup;
import io.netty.channel.nio.NioEventLoopGroup;
import io.netty.channel.socket.nio.NioServerSocketChannel;

@Component
public class WSServer {

	private static class SingletionWSServer {
		static final WSServer instance = new WSServer();
	}
	
	public static WSServer getInstance() {
		return SingletionWSServer.instance;
	}
	
	private EventLoopGroup mainGroup;
	private EventLoopGroup subGroup;
	private ServerBootstrap server;
	private ChannelFuture future;
	
	public WSServer() {
		mainGroup = new NioEventLoopGroup();
		subGroup = new NioEventLoopGroup();
		server = new ServerBootstrap();
		server.group(mainGroup, subGroup)
			.channel(NioServerSocketChannel.class)
			.childHandler(new WSServerInitialzer());
	}
	
	public void start() {
		this.future = server.bind(9999);
		System.err.println("netty websocket server 啓動完畢...");
	}
}

 websocket初始化器：

package com.wechat.netty;

import io.netty.channel.ChannelInitializer;
import io.netty.channel.ChannelPipeline;
import io.netty.channel.socket.SocketChannel;
import io.netty.handler.codec.http.HttpObjectAggregator;
import io.netty.handler.codec.http.HttpServerCodec;
import io.netty.handler.codec.http.websocketx.WebSocketServerProtocolHandler;
import io.netty.handler.stream.ChunkedWriteHandler;
import io.netty.handler.timeout.IdleStateHandler;

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協議    ======================

		
		// ====================== 增加心跳支持 start    ======================
		// 針對客戶端，如果在1分鐘時沒有向服務端發送讀寫心跳(ALL)，則主動斷開
		// 如果是讀空閒或者寫空閒，不處理
		pipeline.addLast(new IdleStateHandler(8, 10, 12));
		// 自定義的空閒狀態檢測
		pipeline.addLast(new HeartBeatHandler());
		// ====================== 增加心跳支持 end    ======================
		

		// ====================== 以下是支持httpWebsocket ======================
		
		/**
		 * websocket 服務器處理的協議，用於指定給客戶端連接訪問的路由 : /ws
		 * 本handler會幫你處理一些繁重的複雜的事
		 * 會幫你處理握手動作： handshaking（close, ping, pong） ping + pong = 心跳
		 * 對於websocket來講，都是以frames進行傳輸的，不同的數據類型對應的frames也不同
		 */
		pipeline.addLast(new WebSocketServerProtocolHandler("/ws"));
		
		// 自定義的handler
		pipeline.addLast(new ChatHandler());
	}

}

 

-----------------------------------------20191105--------------------------------------------------------------

查看微信發現微信有一個通知推送的功能（例如添加好友時會推送“添加好友的通知”到被添加用戶的手機上並進行彈窗提示），於是今天抽空在項目中增加了該消息推送功能（使用的是第三方插件“個推”）。

流程：用戶A掃描用戶B的二維碼，請求添加B爲好友，則在B的手機上會接收到相應的通知，點擊通知會直接跳轉進入app首頁。

效果如下（接收方即被添加用戶）：

            

示例代碼如下：

public class GetuiPushToApp {

    /**
     * 獲取應用基本信息
     */
    private static String appId = "";
    private static String appKey = "";
    private static String masterSecret = "";
    private static String url = "http://sdk.open.api.igexin.com/apiex.htm";

    public static void send(String title, String text, String cid) throws Exception {
        IGtPush push = new IGtPush(url, appKey, masterSecret);
        NotificationTemplate template = getNotificationTemplate(title, text);
        SingleMessage message = new SingleMessage();
        message.setOffline(true);
        // 離線有效時間，單位爲毫秒
        message.setOfflineExpireTime(24 * 3600 * 1000);
        message.setData(template);
        // 可選，1爲wifi，0爲不限制網絡環境。根據手機處於的網絡情況，決定是否下發
        message.setPushNetWorkType(0);
        Target target = new Target();
        target.setAppId(appId);
        target.setClientId(cid);
        //target.setAlias(Alias);
        IPushResult ret = push.pushMessageToSingle(message, target);
        if (ret != null) {
            System.out.println(ret.getResponse().toString());
        } else {
            System.out.println("服務器響應異常");
        }
    }

經過測試後發現系統仍然存在一些小問題，包括用戶體驗、聊天功能，後續有時間會逐步發現問題並完善問題！

說明：該項目是通過學習慕課大神課堂整理並修改，簡單通過真機試運行測試，可用於學習。

 

源碼免費下載地址：關注微信公衆號“蝦米聊吧”，回覆關鍵字“仿微信聊天”

關注微信公衆號“蝦米聊吧”，後續持續放送“技術架構和資料”乾貨！！！

 

   一個熱衷於分享技術和生活的程序猿，讓我們一起交流吧~      

                    

                  微信掃描二維碼，關注我的公衆號