React with Swoole + chat room to achieve

Separate front and rear ends of the project, the use of chat rooms Swoole + React implementation, the frame structure of the entire project may be a reference, distal react + react-redux + react-router + react-ant, etc., using the background easySwoole, to achieve self middleware ( data encapsulation, token authentication, signature verification), carefully look at the code can learn a lot Oh?!

1. Project Links

 

1.1 swoole (please star)

https://github.com/LaravelChen/swoole_chat...

 

1.2 react (please star)

https://github.com/LaravelChen/React-Small...

 

1.3 api framework (basic needs have been fully achieved, you can try yourself?)

https: //github.com/LaravelChen/swoole_api _...
performance show (strong, strong, strong)

 

2. Introduction

I order to develop more convenient, to achieve their own middleware, encapsulating the body of the request data by using the api authentication token jwt achieve integrated ORM Laravel again encapsulates the data set for the write request process flow api, specifically see App / Model Base directory under the category, particularly the development steps detailed code.

 

3. The main achievement

  • Login registration, verification code (if required tests can be combined with front-end verification code will react to print out)
  • Public chat rooms (Once a user has logged in, the user list that is increased, the user can add friends, operations)
  • Push notifications (you can use asynchronous processes swoole implementation)
  • Private chat rooms (plus a friend to complete private chat)
  • The remaining functions can be added ......

 

4. Install

 

4.1 installed on the background

Here is the logic behind the front end of the corresponding item venue to:  HTTPS: //github.com/LaravelChen/React-Small ...

php server start

Because swoole permanent memory, so once modify the code, you need to reboot.

 

4.2 front-end installation

npm install
npm run start

 

5. Project results

5.1 chat room

5.2 I 聊室

 

 

 

此外,还有其他的加好友,消息推送等效果不演示了,可以自行下载安装使用,效果很好!

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;

 

Guess you like

Origin www.cnblogs.com/a609251438/p/11918643.html