一款高颜值、极简式风格的开源聊天应用!

B站影视 2024-12-30 11:54 2

摘要:Java精选面试题 (微信小程序): 5000+ 道面试题和选择题, 真实面经 , 简历模版 ,包含Java基础、并发、JVM、线程、MQ系列、Redis、Spring系列、Elasticsearch、Docker、K8s、Flink、Spark、架构设计、大

Java精选面试题 (微信小程序): 5000+ 道面试题和选择题, 真实面经 , 简历模版 ,包含Java基础、并发、JVM、线程、MQ系列、Redis、Spring系列、Elasticsearch、Docker、K8s、Flink、Spark、架构设计、大厂真题等,在线随时刷题!01 介绍

自我做的客服聊天以来,让我做一套聊天应用的呼声越来越多,加上那套客服聊天由于没有组件化、UI 设计等问题,也让我一直心有遗憾做的不够完美,于是利用空余时间做了一套相对完整的聊天应用。HasChat 是一套使用全新技术完成的通讯聊天网页。

PC 网页版前端:Vue3+Vite+TypeScript+Pinia+Naive UI+Socket.io

移动版前端: uni-app+Socket.io

后端:Express.js

作者开源目的旨在给刚学习该领域的新人一些引路,不管你是前端还是后端,都能对你在通讯聊天这个领域有一点点的启发。02 功能说明

登陆、随机获取用户登陆

发送邮箱验证码注册

发送表情+文字组合的富文本内容

发送图片内容,查看大图

enter 发送信息,enter+ctrl 换行输入内容

消息提醒

未读消息标记

记录历史会话

记录历史聊天内容

切换主题

发送视频

发送语音(仅移动端具备)

03 环境部署

Node.Js >= 15.0.0

Mysql >= 5.7.0 (仅mysql版本需要,但执行mysql文件需要8.0以上版本)

1. 下载项目

前端

后端mysql版本

git clone -b main https://gitee.com/howcode/has-chat-service.git

后端json版本

git clone -b master https://gitee.com/howcode/has-chat-service.git

2. 启动项目

1)安装依赖

前、后端:npm install

2)mysql配置(json版本跳过)

在mysql的版本中,找到目录store下的sql文件,运行sql文件

依次运行全部sql文件,并且刷新数据库表就可看到了

找到 config.js 文件

const db = mysql.createConnection({host: "", // 主机地址 (默认:localhost)user: "", // 用户名password: "", // 密码database: "", // 数据库});

3)邮箱配置(json版本跳过)

找到 config.js 文件

emailConfig: { //邮箱配置host: "smtp.qq.com",//邮箱服务器 这里我用的QQ邮箱port: 465,//邮箱使用端口secure: true,//是否使用默认的465端口auth: {user: "", // 发送方邮箱地址pass: "" // smtp 验证码}}04 启动

启动项目/服务

后端

node app.js

前端

npm run dev

到此,项目可以正常运行

05 界面截图

开源地址: https://gitee.com/howcode/has-chat

Java精选面试题(微信小程序):3000+道面试题,包含Java基础、并发、JVM、线程、MQ系列、Redis、Spring系列、Elasticsearch、Docker、K8s、Flink、Spark、架构设计等,在线随时刷题!

文章有帮助的话,点在看,转发吧!

来源:小康科技论

相关推荐