Awesome
webchat
<img src="https://s3.qiufengh.com/webchat/webchat-logo-160.png" />
说明: master 分支还不太稳定，可以查看 https://github.com/hua1995116/webchat/tree/v2.2.0 稳定分支， 3.0 版本持续重构中。
功能
- 注册登录功能
- 聊天功能
- 查看历史记录
- 多个聊天室
- 与机器人对接
- 图片发送
- 发送链接
- 发送表情
- 图片预览
- 消息未读
- 断线重连
- 好友资料查看
- 添加好友
- 单聊
- 搜索好友
- 热门好友推荐
启动项目
Dev环境: MongoDB、Node 8.5.0+、Npm 5.3.0+
Prod环境: Redis、MongoDB、Node 8.5.0+、Npm 5.3.0+
启动客户端
$webchat cd client
$client npm install -----安装依赖
$client npm run serve -----运行
启动服务端
$client cd ..
$webchat npm install
$webchat npm run dev
打包
打包客户端
cd client
npm run build
服务端运行
cd ..
npm run prod
在线观看
<img src="http://s3.qiufengh.com/images/1536588077.png" width="400" />技术交流
qq群: 437938625
微信群: 加微信拉你进微信群。
<img src="https://s3.qiufengh.com/webchat/webcaht-my.jpeg?imageView2/2/w/360" width="300" />技术栈
- 前端 vue，vue-router ,vuex
- 后端 nodejs，express
- 数据库 mongodb
- 通讯 websocket
- 脚手架工具 vue-cli
效果
<img src="http://s3.qiufengh.com/screenshot/1.png"/> <img src="http://s3.qiufengh.com/screenshot/2.png"/> <img src="http://s3.qiufengh.com/screenshot/3.png"/> <img src="http://s3.qiufengh.com/screenshot/4.png"/>版本更新
v3新增功能
- 网络异常判断、重连提示
- 多端信息同步
- 好友资料查看
- 添加好友
- 单聊
- 搜索好友
- 热门好友推荐
- 性别、手机号修改
- 搜索加好友
版本预览
v2 稳定版本
https://github.com/hua1995116/webchat/tree/v2.2.0
其他版本
<a href="./RELEASE.md">RELEASE</a>
项目wiki
https://qiufeng.blue/node/#websocket-%E7%B3%BB%E5%88%97
API
<a href="./API.md">API</a>
License
MIT License
Copyright (c) 2018 蓝色的秋风