項目介紹

前段時間在B站看到了有一個UP主在講uni-app即時聊天的項目（逸刻時光），在看了這個視頻之后，感覺還是挺有興趣的，所以在看他的講解視頻之后，就自己動手寫了這個即時聊天項目，在樣式方面跟（逸刻時光）相比改動的地方還是比較多的，后端的是我使用的是node的koa框架，而（逸刻時光）的up主是使用express，個人覺得還是koa框架用起來比較好用，沒有那么多的嵌套，可以使用async和await來解決回調地獄等，另外就是(逸刻時光）的up主更新這個項目是更新的比較慢的，所以前后端的很多問題都得自己去找資料解決，花的時間還是比較多的

更多文章請訪問 深的個人博客

技術棧

前端

uni-app
weapp.socket.io

后端

node
koa
socket.io
mongodb

node中間件：
images（關于圖片的一些操作，在這個項目中用到了圖片壓縮功能）
jsonwebtoken（生成token）
koa-bodyparser（解析參數）
koa-multer（上傳文件）
koa-router（koa框架路由）
koa-static（靜態資源）
koa2-cors（解決跨域）
nodemailer（郵件發送）

頁面展示

以下照片均為真機測試時的截圖

tarbar頁面

聊天頁

用戶搜索-用戶詳情-用戶請求-用戶通知

群組

朋友圈

功能簡介

用戶

注冊
登陸
注銷
用戶信息修改
用戶搜索
添加好友
刪除好友
好友備注

聊天

圖片，語音，定位，文字信息的發送
私聊
群聊
圖片瀏覽

群組

創建
解散（群主的權限功能）
移除群成員（群主的權限功能）
邀請好友加入群組（群成員的功能）
修改群信息（群主的權限功能）
修改群內昵稱（群成員的功能）
退出群組（群成員的功能）
轉讓群主（群主的權限功能）

朋友圈

動態發表，刪除，點贊，評論
圖片瀏覽
評論回復
訪客記錄，刪除訪客記錄
刪除通知
留言和留言刪除

通知

系統通知
好友申請通知
評論和點贊通知
動態通知
留言通知
訪客通知

通知操作：
刪除通知
未讀通知
標位已讀

其他功能

會話表（index頁面）：刪除對話
好友列表（users頁面）：分組導航

項目動圖（手機端）展示

圖片太大可以縮放網頁查看或者在新的標簽頁查看圖片

登陸注冊

用戶信息

users頁面

群組

聊天

加好友

朋友圈

項目動圖（H5端）展示

聊天

朋友圈

總結

以上是生活随笔為你收集整理的uni-app 即时聊天的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。