# wisdom-ask **Repository Path**: chen-junfa/wisdom-ask ## Basic Information - **Project Name**: wisdom-ask - **Description**: 基于vue+element前端，flask后端，mysql数据库的多聊天室系统 - **Primary Language**: Unknown - **License**: MIT - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 4 - **Forks**: 0 - **Created**: 2024-12-26 - **Last Updated**: 2026-01-30 ## Categories & Tags **Categories**: Uncategorized **Tags**: Vue ## README # ”智问“多聊天室系统 ## 系统概述 “智问”的多聊天室系统。该系统旨在提供一个功能丰富、用户友好的交流平台，支持用户之间的实时互动。 ## 系统功能 ### 用户注册管理 1. 支持用户注册，实现用户身份验证与资料管理。 2. 提供用户登陆功能，确保会话安全。 ### 聊天室后台管理 1. 允许后台管理员新增、删除和修改聊天室属性。 2. 后台可以对聊天室用户进行管理，可以操作新增聊天室用户、踢出用户、禁言等操作。 ### 多聊天室功能 1. 用户可申请加入多个聊天室，享受多样化的交流体验。 2. 显示聊天室与用户列表，便于用户快速查找与加入。 3. 聊天记录存档功能，支持历史消息导出。 ### 额外功能 1. 引入ai聊天功能。 ## 系统实现 ### 技术栈 前端使用vue.js框架进行开发，并使用element plus组件库进行界面美化。 后端使用mysql数据库进行数据管理，使用python的flask库构建后端api（使用flask_mysqldb连接并使用数据库） ### 具体实现 #### 数据库设计 该项目使用以下实体：消息，用户，房间。以下联系：申请，用户\_房间，用户\_消息，房间\_消息。ER图如下： ![](./README_RES/ER.png) 通过Power Designer生成pdm（Physical Data Model）如下： ![](./README_RES/PDM.png) 最终输出sql脚本如下： ```sql /*==============================================================*/ /* DBMS name: MySQL 5.0 */ /* Created on: 2024/12/17 22:49:12 */ /*==============================================================*/ /* alter table Apply drop foreign key FK_APPLY_APPLY_ROOM; alter table Apply drop foreign key FK_APPLY_APPLY2_USER; alter table Message drop foreign key FK_MESSAGE_MSG_ROOM_ROOM; alter table Message drop foreign key FK_MESSAGE_MSG_USR_USER; alter table usr_room drop foreign key FK_USR_ROOM_USR_ROOM_ROOM; alter table usr_room drop foreign key FK_USR_ROOM_USR_ROOM2_USER; alter table Apply drop foreign key FK_APPLY_APPLY_ROOM; alter table Apply drop foreign key FK_APPLY_APPLY2_USER; drop table if exists Apply; alter table Message drop foreign key FK_MESSAGE_MSG_USR_USER; alter table Message drop foreign key FK_MESSAGE_MSG_ROOM_ROOM; drop table if exists Message; drop table if exists Room; drop table if exists User; alter table usr_room drop foreign key FK_USR_ROOM_USR_ROOM2_USER; alter table usr_room drop foreign key FK_USR_ROOM_USR_ROOM_ROOM; drop table if exists usr_room; */ /*==============================================================*/ /* Table: Apply */ /*==============================================================*/ create table Apply ( user_id int not null comment '', room_id int not null comment '', apply_time datetime not null comment '', apply_status char(1) not null comment '', primary key (user_id, room_id,apply_time,apply_status) ); /*==============================================================*/ /* Table: Message */ /*==============================================================*/ create table Message ( msg_id int not null AUTO_INCREMENT comment '', user_id int comment '', room_id int comment '', msg_content text not null comment '', msg_time datetime not null comment '', primary key (msg_id) ); /*==============================================================*/ /* Table: Room */ /*==============================================================*/ create table Room ( room_id int not null AUTO_INCREMENT comment '', room_name varchar(64) not null comment '', room_description text comment '', closed char(1) not null comment '', primary key (room_id) ); /*==============================================================*/ /* Table: User */ /*==============================================================*/ create table User ( user_id int not null AUTO_INCREMENT comment '', user_passwd char(64) not null comment '', user_name varchar(64) not null comment '', user_gender char(1) not null comment '', user_birthday date comment '', user_phone numeric(11,0) comment '', user_email varchar(64) comment '', primary key (user_id) ); /*==============================================================*/ /* Table: usr_room */ /*==============================================================*/ create table usr_room ( user_id int not null comment '', room_id int not null comment '', ban char(1) not null comment '', primary key (user_id, room_id) ); alter table Apply add constraint FK_APPLY_APPLY_ROOM foreign key (room_id) references Room (room_id) on delete restrict on update restrict; alter table Apply add constraint FK_APPLY_APPLY2_USER foreign key (user_id) references User (user_id) on delete restrict on update restrict; alter table Message add constraint FK_MESSAGE_MSG_ROOM_ROOM foreign key (room_id) references Room (room_id) on delete restrict on update restrict; alter table Message add constraint FK_MESSAGE_MSG_USR_USER foreign key (user_id) references User (user_id) on delete restrict on update restrict; alter table usr_room add constraint FK_USR_ROOM_USR_ROOM_ROOM foreign key (room_id) references Room (room_id) on delete restrict on update restrict; alter table usr_room add constraint FK_USR_ROOM_USR_ROOM2_USER foreign key (user_id) references User (user_id) on delete restrict on update restrict; ``` #### 后端设计 ##### 总体思路 通过flask后端连接mysql数据库提供api服务，使用简易令牌机制验证用户身份达成权限管理。 ##### 简易令牌机制概述 用户登陆时上传usr_id和passwd，验证成功后生成一个随机令牌token，在全局变量tokens中设置tokens[token]=usr_id，在此之后用户对后端的访问均使用该token表明自己身份，而不再使用用户ID加密码的方式。 此方案的好处在于不需要再客户端临时保存密码，同时也不会频繁传输密码，降低了密码泄露的风险。纵使泄露也只是一个临时有效的令牌，后果相对不那么严重。 ##### 特殊处理 数据库中不存储用户的密码，而是存储用户密码的hash值，这样即使是管理员或者数据库泄露也不会导致用户密码被外人所知。 ##### 具体API 具体api已经在wisdom-ask-后端/sever.py中注释清楚。 #### 前端设计 使用vue框架，以组件的思维设计界面。 分为admin，entry，user三个界面 其中admin为单组件界面；entry包含Entry主组件和Login、Signup子组件，user界面包含主组件User主组件；一个可唤出的MyInfo组件用于修改管理自己的用户消息，一个可唤出的ApplyRoom组件用于浏览房间信息并申请加入房间，两个房间组件ChatRoom和ChatBot，以及一个房间组件的子组件Message 通过层层封装的方式组成复杂的应用界面，另外使用了element plus库，借助其现成的组件实现一定程度上简化了界面编写。 ### 效果展示 未打包为生产环境应用，暂且使用开发环境的启动方式。 首先在wisdom-ask-前端目录下执行`npm run dev`启动前端的vite开发服务器 然后在wisdom-ask-后端目录下执行`python sever.py`启动后端api访问 最后访问`http://localhost:5173/pages/entry`即可开始使用应用 效果图片如下： ![屏幕截图(247)](./README_RES/屏幕截图(236).png) ![](./README_RES/屏幕截图(237).png) ![](./README_RES/屏幕截图(238).png) ![](./README_RES/屏幕截图(239).png) ![](./README_RES/屏幕截图(240).png) ![](./README_RES/屏幕截图(241).png) ![](./README_RES/屏幕截图(242).png) ![](./README_RES/屏幕截图(243).png) ![](./README_RES/屏幕截图(244).png)