在线聊天室项目(Vue3 + SpringBoot)

目录

项目描述

技术栈选型

项目开发过程文档

项目页面效果

项目源码地址


项目描述

1.网页在线聊天室,实现了群组系统和好友系统,因此项目可以在公共群组,私有群组和私人之间进行聊天

2. 项目主要使用Websocket 实时通信技术实现聊天,使用RedisRabbitMQ提高程序的效率和消息收发稳定性。

3.前端使用indexDB实现聊天记录的本地存储和优先显示,使用用户登录信息和本地记录时间戳作为过滤条件实现消息同步。

**4.**项目重点编写是在后端收发逻辑,及数据的存储和同步方面。对于前端视图可能略显简陋。

5.但项目使用Vue3Springboot等主流技术进行开发,易于进行二次开发/功能扩展。

**6.**项目仅实现了重点及基本功能,对于更完善的边缘功能没有特别编写,但不影响聊天室的基本功能。

项目gitee源码在文章最后。

技术栈选型

前端:

Vite 脚手架构建Vue3项目。

ElementPlus组件库快速搭建前端页面。

indexDB将历史记录存储在本地,先展示本地再查询最新消息进行同步。

Pinia实现组件间状态共享

emoji-picker-element库作为聊天时的表情集选择。

axiox异步请求库实现后端接口调用。

后端:

SpringBoot ,②MyBatisPlus

Redis存储用户的连接信息,群组用户关系信息,和注册验证码等缓存数据。

RabbitMQ消息中间件处理消息的收发,异步处理等操作。

WebSocket实现客户端和服务端的实时通信,实现消息实时收发。

⑥使用JavaMail实现用户发送/接收验证码实现邮箱注册。

⑦使用SpringSecurity 中的强散列密码 编码器 工具,实现用户密码加密和验证。

java-jwt用于验证用户登录状态。

数据库管理系统

MySQL

项目开发过程文档

飞书文档地址:https://scnw01ap0tqh.feishu.cn/wiki/UwVzwJPlAiCxv1k2OzJcP3Asnog

文档包含:数据库/表设计,前后端功能设计及开发过程。

项目页面效果

登录&注册

添加好友

私人聊天

创建群组

邀请用户加入群组

主动搜索 加入群组

群组聊天

公共群组(所有用户注册既加入此群组 )

项目源码地址

gitee地址: gitee.com/maohe101/chat-room

关于此项目的启动教程在Gitee中有说明。

相关推荐
2601_9537208217 小时前
【计算机毕业设计】基于Vue与Spring Boot的高校兼职信息服务平台设计与实现
spring boot·后端·课程设计
evans在进步20 小时前
Spring Boot 核心机制详解:可执行 JAR、CORS、静态资源与配置绑定
spring boot·后端·jar
Sayuanni%320 小时前
SpringBoot 从注解到源码:核心知识点总结
java·spring boot·后端
m0_587383001 天前
社区家政系统开发实战:从需求分析到上线部署全指南
java·spring boot·spring·需求分析
凤山老林1 天前
动态 i18n 体系落地:Spring Boot 多租户热加载与前后端协同实践
java·spring boot·后端·i18n
【赫兹威客】浩哥1 天前
基于SpringBoot+Vue3的健身运动管理系统|WebSocket实时消息 健身房毕设项目
spring boot·websocket·课程设计
凤山老林1 天前
数据库读写分离与动态路由实战:Spring Boot + ShardingSphere-JDBC 生产配置
数据库·spring boot·后端·分库分表·sharding-jdbc
RuoyiOffice1 天前
SpringBoot3+Vue3 代码生成器深拆:元数据 IR、模板编译与安全同步
spring boot·vue3·mybatis plus·代码生成器·spring boot 3·velocity·元数据驱动
paopaokaka_luck1 天前
基于springboot3+vue3的支教志愿者管理系统(AI问答、协同过滤算法、Echarts图形化分析)
spring boot·echarts
2601_963870181 天前
【计算机毕业设计】基于Vue+Spring Boot的助农电商系统的设计与实现
spring boot·后端·课程设计