基於Vue二、WebSocket的仿騰訊QQ

概述

本項目基於Vue2進行高仿手機QQ的webapp，UI上使用的是museUI，使用springMVC搭建的後臺。聊天方面，使用WebSocket實現瀏覽器與服務器全雙工通訊，容許服務器主動發送信息給客戶端。源碼大部分有註釋，若是不清楚的能夠問我，我會盡可能回覆的。

功能

• 登陸、註冊——註冊完成系統返回一個id，用id加密碼便可登陸

• 添加好友——右上角加號點開，輸入用戶id便可完成添加（暫未實現用戶驗證添加）

• 聊天功能——好友之間能夠實時在線通訊，不管你在哪一個頁面都能收到好友消息（退出不行）

• 長按刪除——長按刪除已有的消息

• 項目中數據流動由vuex進行控制

效果圖

--登陸與註冊--

--側邊欄與我的主頁--

--添加好友--

--長按刪除--

--好友聊天--

其餘說明

• 本項目還有不少bug，各位大佬若是發現了，能夠通知我下，我會很是感激的

• 本項目還有不少功能沒實現，若是你發現點擊沒反應，那極可能是我只寫了個ui在那

• 項目暫不支持聊天記錄緩存，一旦你退出系統，聊天記錄將清空

• 這是我使用vue作的第二個webapp，雖然仍是不怎麼樣，有興趣的能夠去看下個人第一個webapp——醫院管理信息系統 項目地址 https://github.com/linguoqiang001/his

• 最近比較忙，暫時就作到這，後面有時間的話會繼續完善項目，後臺和數據庫部分，有時間我整理下一併上傳

技術棧

• vue-cli
• vue2
• vue-router
• vuex
• axios
• less
• webpack2
• muse-ui

項目地址

https://github.com/linguoqiang001/chat