项目主要由前端的html,js,css和后端的mysql数据库,flask框架代码等构成
前端任务由陈正胤实现,谢锦汉辅助完成,数据库由李慕宇完成,后端的其他部分由金庆哲完成
- backend.py:服务器实现部分
- user.py:login所需数据结构
- db:
- mydb.py:数据库查询部分
- config.py:数据库连接设置
- utils.py:辅助函数
- templates:所需所有html文件
- static:静态文件(图片等部件)
本项目实现了以下功能:
- 用户的注册与登录
- 聊天室的创建
- 多人聊天
- 私人聊天
- 根据关键字寻找用户或聊天室(并加入聊天室或是开始私聊)
- 修改用户密码
- 新消息提醒,聊天列表的随时更新
- 查看用户所在的所有聊天室(不包括私聊),并可以选择离开
- 用户的登出
主要介绍各种功能实现的思路,并没有包括所有细节.前端还包括了页面的外观设计以及各种点击操作,跳转操作等.数据库的具体构建也不再赘述,这里以叙述三者间交互逻辑为主.更细节的东西在代码中有所体现.
- 前端:检查两次输入密码是否一致,发送相应的ajax请求到特定url上,ajax内容包括用户名,密码等
- 服务器:接收前端发送数据,调用数据库函数查询,得到返回结果并返回给前端.返回值代表:用户名已存在;注册成功;失败
- 数据库:检查用户名是否已经存在,若注册成功就将用户信息登录到数据库里
- 前端:发送ajax请求到特定url,包括用户名和密码
- 服务器:接收前端发送数据,调用数据库函数查询,得到返回结果并返回给前端.返回值代表:用户名不存在;密码不正确;成功.如果注册成功,使用flask-login的登入操作来标记连接属于哪个用户.
- 数据库:检查用户名是否存在,以及密码是否正确,并返回给服务器
- 前端:发送请求给服务器
- 服务器:接收前端发送消息,使用flask-login的logout操作进行登出,并跳转到登陆界面
- 前端:发送用户名,旧密码,新密码给服务器
- 服务器:接收数据,传给数据库,返回一个结果给前端
- 数据库:检查用户名和旧密码是否匹配.如果匹配,修改用户的密码.返回一个结果给服务器
- 前端:发送消息内容和所在聊天室给服务器
- 服务器:将用户名和消息内容以及聊天室名称发给数据库,返回一个结果给前端
- 数据库:在对应聊天室中构建一条消息,返回是否成功给服务器
-
前端:发送查询请求到后端,内容包括关键字
-
服务器:接收关键字,将关键字传给数据库,并向前端返回结果(一个list)
-
数据库:根据关键字查找用户或聊天室,返回给后端服务器
- 前端:发送聊天室名称给服务器,如果加入成功,跳转到聊天页面
- 服务器:将聊天室名称和用户id一起发给数据库,并向前端返回一个结果
- 数据库:查看聊天室是否存在,该用户是否已经在该聊天室中,返回相应结果给服务器
- 前端:发送创建请求到后端,内容包括聊天室名称
- 服务器:接收聊天室名称,并将加入了标记聊天室类型的前缀的聊天室名称和创建者id一起送给数据库,请求创建.如果创建成功,让创建者进入聊天室并在聊天室中发送第一条消息
- 数据库:查询聊天室是否已经存在.返回:已存在;创建成功;失败
- 前端:发送离开请求给后端,内容包括用户名和房间名
- 服务器:根据得到的数据调用函数访问数据库,返回操作结果给前端
- 数据库:将用户从房间中移除,返回操作结果给服务器
- 前端:通过当前用户名和私聊对象用户名建立一个房间名.将这个房间名和私聊对象用户名一起发给服务器
- 服务器:调用创建聊天室操作,创建这个聊天室.如果创建成功,将两个用户都加入聊天室,并让发起者在聊天室中说第一句话
- 前端:每隔一段时间发送一个ajax请求给服务器,请求得到当前该用户所在的所有房间以及房间最后一条消息的产生时间.如果产生时间和之前保存的值不一样,说明这个房间有新消息,用一个图标(小铃铛)来标记该房间.同时不断更新页面上显示的房间列表,这样房间列表会及时更新(他人和自己私聊时会多出一个房间,以让用户注意到)
- 服务器:接收前端请求,调用函数访问数据库,返回一个list给前端
- 数据库:根据服务器发来的用户名查询该用户所在的所有房间,以及这些房间最后消息的产生时间,返回给服务器.
- 前端:显示保存的当前房间的消息内容.如果发现当前房间消息有更新(根据前面的新消息查询逻辑),就发送一个请求给服务器,拿到新的消息列表并显示.
- 服务器:接收前端请求,调用函数访问数据库,返回消息列表给前端
- 数据库:根据服务器发来的房间名来查询该房间的所有消息,返回给服务器