黑马-大事件项目（总结+BUG修复）

怼烎@ 2023-10-02 12:03 9阅读 0赞

# 前言 #

最近把Nodejs和Ajax学习了一下，找到一个很不错的练手项目：黑马刘龙彬老师主讲的大事件项目，整体看完，给刘老师点个赞，讲的非常细致，开发流程清晰，涉及的知识点也很精准。另外黑马还为这个项目提供了在线接口文档，并且将后端服务器也上线发布了，真是自学小伙伴的福音啊。最后，再次给黑马程序员和刘老师点个赞。

# 项目介绍 #

## 项目名称 ##

大事件

## 后端接口文档 ##

[说明--ShowDoc![icon-default.png_t_L9C2][]https://www.showdoc.com.cn/escook?page\_id=3707158761215217][--ShowDoc_icon-default.png_t_L9C2_https_www.showdoc.com.cn_escook_page_id_3707158761215217]

## 前端UI图概览 ##

### 登录页 ###

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16][]

### 首页 ###

### ![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 1][] ###

### 文章管理-文章类别 ###

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 2][]

### 文章管理-文章列表 ###

### ![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 3][] ###

### 文章管理-发布文章 ###

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 4][]

### 个人中心-基本资料 ###

### ![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 5][] ###

### 个人中心-更换头像 ###

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 6][]

### 个人中心-重置密码 ###

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 7][]

## 知识点 ##

### 前端 ###

html,css,字体图标,layui

js,jquery,ajax,formData

template, tinymce, cropper

### 后端 ###

nodejs，express服务器，静态资源托管，cors跨域，jwt身份认证，bscript不可逆加密，joi请求字段验证，multer解析formData格式数据，promisify和promise，async和await异步编程

mysql

### 版本管理 ###

git

# 项目源码、数据库表、postman测试工程下载 #

[大事件项目源码，大事件项目源码资源-CSDN文库![icon-default.png?t=N6B9][icon-default.png_t_N6B9]https://download.csdn.net/download/qfc\_128220/88049795][-CSDN_icon-default.png_t_N6B9_icon-default.png_t_N6B9_https_download.csdn.net_download_qfc_128220_88049795]

# 项目源码将刘老师未开发的功能完成，包括 #

前端：

文章管理-文章列表-编辑 功能

后端：

完成了以下接口的开发

*  `/my/article/list`
 *  `/my/article/delete/:id`
 *  `/my/article/:id`
 *  `/my/article/edit`

## 项目源码解决了刘老师已开发的功能的部分BUG，包括 ##

前端issue：

发布文章成功后，发布文章页面会自动跳转到了文章列表页面，但是左侧导航栏未跟随变动

后端issue：

涉及到新增的部分接口，如

新增文章分类接口`/my/article/addcates，在第一次新增失败后，报错`Error 【ERR\_HTTP\_HEADERS\_SENT】: Cannot set headers after they are sent to the client。原因是：return res.send() 或者 return res.cc(）没有起到终止外层函数后续代码执行的效果。

## 项目源码整合了前后端代码，将它们部署在同一个服务器上 ##

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 8][]

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 9][]

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 10][]

## 整理了postman测试工程 ##

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 11][]

## 整理了数据库建表sql ##

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 12][]

CREATE SCHEMA `my_db_01` ;
    
    CREATE TABLE `my_db_01`.`en_users` (
      `id` INT NOT NULL AUTO_INCREMENT,
      `username` VARCHAR(255) NOT NULL,
      `password` VARCHAR(255) NOT NULL,
      `nickname` VARCHAR(255) NULL,
      `email` VARCHAR(255) NULL,
      `user_pic` TEXT NULL,
      PRIMARY KEY (`id`),
      UNIQUE INDEX `id_UNIQUE` (`id` ASC) VISIBLE,
      UNIQUE INDEX `username_UNIQUE` (`username` ASC) VISIBLE)
    ENGINE = InnoDB
    DEFAULT CHARACTER SET = utf8mb4
    COLLATE = utf8mb4_0900_ai_ci
    COMMENT = '用户信息表';
    
    CREATE TABLE `my_db_01`.`en_articles` (
      `id` INT NOT NULL AUTO_INCREMENT,
      `title` VARCHAR(255) NOT NULL,
      `content` TEXT NOT NULL,
      `cover_img` VARCHAR(255) NOT NULL,
      `pub_date` VARCHAR(255) NOT NULL,
      `state` VARCHAR(255) NOT NULL,
      `is_delete` TINYINT(1) NOT NULL DEFAULT 0,
      `cate_id` INT NOT NULL,
      `author_id` INT NOT NULL,
      PRIMARY KEY (`id`),
      UNIQUE INDEX `id_UNIQUE` (`id` ASC) VISIBLE)
    COMMENT = '文章信息';
    
    CREATE TABLE `my_db_01`.`en_article_cate` (
      `id` INT NOT NULL AUTO_INCREMENT,
      `name` VARCHAR(255) NOT NULL,
      `alias` VARCHAR(255) NOT NULL,
      `is_delete` TINYINT(1) NOT NULL DEFAULT 0 COMMENT '文章分类是否是被删除\n0 表示 未被删除\n1 表示 已被删除',
      PRIMARY KEY (`id`),
      UNIQUE INDEX `id_UNIQUE` (`id` ASC) VISIBLE,
      UNIQUE INDEX `name_UNIQUE` (`name` ASC) VISIBLE,
      UNIQUE INDEX `alias_UNIQUE` (`alias` ASC) VISIBLE)
    COMMENT = '文章分类信息';

请大家注意下：我这里提供的sql语句是通过MYSQL8.0.19版本导出的，如果大家使用的MYSQL版本过低，可能执行上面sql语句时会报错：

> You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version ....

有两个解决方案：

*  更新下自己的MYSQL数据库版本（彻底解决问题）
 *  [mysql 数据库高版本迁移到低版本问题 - 今天的诸葛亮 - 博客园 (cnblogs.com)][mysql _ - _ - _ _cnblogs.com]

## 额外说明 ##

1、由于后端代码没有上传node\_modules文件夹，所以第一次使用前，请对后端工程执行npm install下载项目依赖的第三方模块

2、注意后端对接数据库的配置在api\_server/db/index.js中，请将数据库用户名和密码换成自己的

3、jwt字符串有效期8h，若要不合适，请到api\_server/config.js中修改

4、前端工程中ajax请求触发前都要先执行 assets/js/ajaxPre.js，ajax请求的url前缀拼接，请注意按需修改

[icon-default.png_t_L9C2]: https://csdnimg.cn/release/blog_editor_html/release1.9.2/ckeditor/plugins/CsdnLink/icons/icon-default.png?t=L9C2
[--ShowDoc_icon-default.png_t_L9C2_https_www.showdoc.com.cn_escook_page_id_3707158761215217]: https://www.showdoc.com.cn/escook?page_id=3707158761215217
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16]: https://img-blog.csdnimg.cn/f8534fb7e7354bfda089e8c480f8e013.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LyP5Z-O5LmL5aSW,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 1]: https://img-blog.csdnimg.cn/40f12be8035e43b9be9501a52ee3524e.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LyP5Z-O5LmL5aSW,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 2]: https://img-blog.csdnimg.cn/d16010cb5f574309afb64d59e1325838.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LyP5Z-O5LmL5aSW,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 3]: https://img-blog.csdnimg.cn/f8588ddb1c784983b5f56680330cc2e2.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LyP5Z-O5LmL5aSW,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 4]: https://img-blog.csdnimg.cn/f5c90a64beba49ceab7d57565678edd2.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LyP5Z-O5LmL5aSW,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 5]: https://img-blog.csdnimg.cn/a875d2d3a5fb436c95da53ebf1438eba.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LyP5Z-O5LmL5aSW,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 6]: https://img-blog.csdnimg.cn/2a1e74b33e3b415fa8193bdec6476bae.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LyP5Z-O5LmL5aSW,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 7]: https://img-blog.csdnimg.cn/27d74e25cf4243bca48d5420c90ae49d.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LyP5Z-O5LmL5aSW,size_20,color_FFFFFF,t_70,g_se,x_16
[icon-default.png_t_N6B9]: https://csdnimg.cn/release/blog_editor_html/release2.3.5/ckeditor/plugins/CsdnLink/icons/icon-default.png?t=N6B9
[-CSDN_icon-default.png_t_N6B9_icon-default.png_t_N6B9_https_download.csdn.net_download_qfc_128220_88049795]: https://download.csdn.net/download/qfc_128220/88049795
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 8]: https://img-blog.csdnimg.cn/8a3aaf6142324a38bb0169a83d0f1167.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LyP5Z-O5LmL5aSW,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 9]: https://img-blog.csdnimg.cn/ac098c5b47db472f8a0fe079ebacf8f6.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LyP5Z-O5LmL5aSW,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 10]: https://img-blog.csdnimg.cn/dd0e220252d341919a89e796593cb940.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LyP5Z-O5LmL5aSW,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 11]: https://img-blog.csdnimg.cn/0248943f55fb4b8b8d749b403ee4b40f.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LyP5Z-O5LmL5aSW,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LyP5Z-O5LmL5aSW_size_20_color_FFFFFF_t_70_g_se_x_16 12]: https://img-blog.csdnimg.cn/6d372eff3f6347bda17287e6c6627de4.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LyP5Z-O5LmL5aSW,size_20,color_FFFFFF,t_70,g_se,x_16
[mysql _ - _ - _ _cnblogs.com]: https://www.cnblogs.com/gaosai/p/13707310.html