用Swoole+React 实现的聊天室
程序员文章站
2022-06-07 11:28:02
前后端分离的项目,使用 Swoole+React 实现的聊天室,整个项目的框架结构可以进行参考,前端 react+react-redux+react-router+react-ant 等等,后台使用 easySwoole,自行实现中间件(数据封装,token 验证,签名验证), 认真看代码可以学到很 ......
前后端分离的项目,使用 swoole+react 实现的聊天室,整个项目的框架结构可以进行参考,前端 react+react-redux+react-router+react-ant 等等,后台使用 easyswoole,自行实现中间件(数据封装,token 验证,签名验证), 认真看代码可以学到很多哦,?!
1. 项目链接
1.1 swoole(请 star)
https://github.com/laravelchen/swoole_chat...
1.2 react(请 star)
https://github.com/laravelchen/react-small...
1.3 api 框架 (基本需求已全部实现,可以自己试试?)
https://github.com/laravelchen/swoole_api_...
性能展示 (强,强,强)
2. 简介
本人为了更加便利的开发,自行实现了中间件,封装了请求数据体,利用 jwt 实现 api 的 token 验证,集成了 laravel 的 orm,再次封装了一套适合 api 编写流程的数据请求流程,具体可以看 app/base 目录下的 model 类,具体开发步骤详见代码即可。
3. 主要实现
- 登录注册,验证码发送(如果需要测试,可以结合前端 react 将验证码打印出来即可)
- 公共聊天室(一旦用户登录,用户列表即会增加,该用户可以进行加好友操作)
- 消息推送(可以利用 swoole 的异步进程实现)
- 私聊室 (加完好友即可进行私聊)
- 其余功能可以添加......
4. 安装
4.1 后台安装
这里只是后台逻辑,前端的对应项目请移步到: https://github.com/laravelchen/react-small...
php server start
因为 swoole 常驻内存,所以一旦修改代码,需要重启。
4.2 前端安装
npm install
npm run start
5. 项目效果
5.1 畅聊室
5.2 私聊室
此外,还有其他的加好友,消息推送等效果不演示了,可以自行下载安装使用,效果很好!
6.postman 接口参考
https://www.getpostman.com/collections/7f9...
7. 数据表结构
1. 数据库名
swoole_framework
chat_content 表
1 create table `chat_content` ( 2 `id` int(11) unsigned not null auto_increment comment 'id', 3 `user_id` int(11) not null comment '用户id', 4 `to_user_id` int(11) default null comment '接收方', 5 `action` enum('public','private') not null default 'public' comment '操作样式', 6 `chat_content` varchar(255) not null default '' comment '聊天记录', 7 `created_at` datetime default null comment '创建时间', 8 `updated_at` timestamp null default current_timestamp on update current_timestamp comment '更新时间', 9 `deleted_at` timestamp null default null comment '删除时间', 10 primary key (`id`), 11 key `user_id` (`user_id`,`to_user_id`) 12 ) engine=innodb auto_increment=116 default charset=utf8mb4;
friends 表
1 create table `friends` ( 2 `id` int(11) unsigned not null auto_increment, 3 `user_id` int(11) default null comment '用户id', 4 `to_user_id` int(11) default null comment '好友id', 5 `created_at` timestamp null default null, 6 `updated_at` timestamp null default null on update current_timestamp, 7 `deleted_at` timestamp null default null, 8 primary key (`id`) 9 ) engine=innodb auto_increment=13 default charset=utf8; 10
notification 表
1 create table `notification` ( 2 `id` int(11) unsigned not null auto_increment, 3 `type` enum('adduser') not null default 'adduser' comment '类型', 4 `action` enum('receive','refuse','default') default 'default' comment '当前的种类', 5 `user_id` int(11) not null comment '发送方id', 6 `message` varchar(255) default null comment '信息', 7 `to_user_id` int(11) not null comment '接送方id', 8 `is_read` enum('yes','no') not null default 'no' comment '是否已读', 9 `created_at` datetime not null comment '创建时间', 10 `updated_at` timestamp null default current_timestamp on update current_timestamp comment '更新时间', 11 `deleted_at` timestamp null default null comment '删除时间', 12 primary key (`id`), 13 key `type` (`type`,`user_id`,`to_user_id`) 14 ) engine=innodb auto_increment=21 default charset=utf8mb4;
users 表
1 create table `users` ( 2 `id` int(11) unsigned not null auto_increment comment 'id', 3 `phone` varchar(13) not null default '' comment '手机号', 4 `name` varchar(55) not null default '' comment '姓名', 5 `email` varchar(30) not null default '' comment '邮箱地址', 6 `avatar` varchar(255) default null comment '头像地址', 7 `password` varchar(100) not null default '' comment '密码', 8 `created_at` datetime default null comment '创建时间', 9 `updated_at` timestamp null default current_timestamp on update current_timestamp comment '更新时间', 10 `deleted_at` timestamp null default null comment ' 删除时间', 11 primary key (`id`), 12 unique key `phone` (`phone`), 13 unique key `email` (`email`) 14 ) engine=innodb auto_increment=89 default charset=utf8;