第十四节：node实操(基础结构搭建、注册、登录、jwt校验、路由自动化等)
一. 搭建步骤
(PS：本节重点分享一下思路和步骤，不贴代码了，代码太长了)
1. 安装相关程序集
【npm install koa koa-bodyparser @koa/router】 -- koa相关
【npm install mysql2】 -- 连接mysql的驱动
【npm install dotenv】 -- 读取配置文件
【npm install jsonwebtoken】 --jwt相关
【npm install @koa/multer】 --文件上传相关
2. 封装koa代码
(1).将koa基本代码抽离到app/index.js中
(2).导入koa-bodyparser中间件，用于请求参数的json解析
(3).对外导出app，供入口文件main.js调用
3. 抽离router代码
(1).将用户相关的路由代码抽离到router/user.router.js中
(2).对外导出，供koa代码使用
4. 抽离配置文件
(1).将端口写到.env中，然后通过config/server.js读取端口
(2).入口文件main.js通过导入server.js来获取端口
5. 封装mysql2连接
(1).将mysql的相关连接抽离封装到app/database.js
(2).通过连接池的方式建立连接，并且在使用前，先校验一下是否连接成功
(3).对外导出promise对象供使用
6. 工具类抽离
(1). md5加密方法抽离，位于：utils/md5Utils.js
(2). 统一错误处理方法抽离，位于：utils/error-handle.js, 需要入口函数main.js中调用：require('./utils/error-handle');
二. 业务剖析
1. 结构划分
文件夹结构
middleware: 将一些非DB业务的方法进行封装
service: 抽离sql语句，封装为方法
controller: 核心业务方法，调用server中封装的sql方法，各种验证已经进行完了
以注册接口为例，router中传入多个中间件
(1). user.middleware.js: 包含校验方法 和 密码md5加密方法
(2). user.service.js: 抽离注册方法的sql语句
(3). user.controller.js: 注册方法，调用user.service.js中的sql语句封装，进行最终的DB操作
路由中间件，user.router.js, 需要在app/index中加载
2. 注册接口
(1). 业务分析
A.非空校验 B.校验用户名DB中是否存在 C.密码md5加密 D.插入数据库
(2). 抽离出来多个中间件
verfiyUser： A.非空校验 B.校验用户名DB中是否存在
handlePassword：C.密码md5加密
userController.create：D.插入数据库
(3). 路由中多个中间件的调用
A. 本质
一个路由中调用多个中间件的写法，中间件通过 next() 继续调用下一个
详见：user.router.js 中写法演变
B. 每个中间件中的参数
可以看到最终调用形式：userRouter.post('/addUser', verfiyUser, handlePassword, userController.create);
每个中间件传递进去的参数都是：(ctx, next)
C. 多个中间件之间参数如何传递？
因为每个中间件默认传递的参数都是(ctx, next)，不能修改，但是我们可以借助 ctx.request.body.xx = xxx, 在中间件中进行传递。
（或者直接 ctx.xx=xxx ）
即上一个中间件改了，下一个中间通过ctx.request.body 就能获取到了。
(4). 测试
请求地址：http://localhost:9090/users/addUser
参数：{"userAccount":"admin","userPwd":"123456"}
3. 登录接口
(1). 业务分析
A.非空校验 B.判断该账号DB中是否存在 C.校验密码的准确性 D. 生成token
(2). 中间件拆分抽离
verifyLogin(位于login.middleware.js)： A.非空校验 B.判断该账号DB中是否存在 C.校验密码的准确性
sign(位于login.controller.js)：D. 生成token
(3). 测试
请求地址：http://localhost:9090/CheckLogin
参数：{"userAccount":"admin","userPwd":"123456"}
4. 通用token校验中间件
(1). 业务分析
从Header中authorization中截取token的数据，进行解密即可
(2). 测试
请求地址：http://localhost:9090/TestCheckToken
参数：Header中设置 Bearer xxxx
5. 封装自动加载路由方法
(1).背景
src/router文件夹下有很多业务相关的路由，比如login.router、user.router, 每增加一个都需要在 app/index中注册，很繁琐，现在想写个程序自动读取router文件夹下的文件， 自动进行注册。
(2).方法封装
在router/index.js中声明 autoRegisterRouters方法，读取当前路由的下所有以 .router.js结尾的文件，然后进行注册即可。
6. 文件上传
业务1：插入用户头像
(1). 业务分析
抽离出来三部分：verifyToken, handleSingleUpload, create
分别是： 校验token; 文件上传的配置; 插入数据库
(2). 测试
请求地址：http://localhost:9090/singleUpload 【POST】
参数： Header中设置 Bearer xxxx
form-data中：fileParam1参数设置为file，然后选择文件
业务2：获取用户头像进行查看
(1). 业务分析
上述保存的文件是不含后缀的，这里需要设置文件类型 ctx.type = mimetype，可以返回一个可读流
(2). 测试
请求地址：http://localhost:9090/avatar/1 【GET】
参数： 上面的1代表userId=1
三. 其它
1. 指令的添加
在package.json中添加指令，"serve": "nodemon ./src/main.js" ，以便于可以通过【npm run serve】启动
2. 格式化工具的安装
安装 prettier，用于格式化代码 【npm install prettier -D】
查看代码
module.exports = {
// 一行最多多少个字符
printWidth: 180,
// 指定每个缩进级别的空格数
tabWidth: 2,
// 使用制表符而不是空格缩进行
useTabs: true,
// 在语句末尾打印分号
semi: true,
// 使用单引号而不是双引号
singleQuote: true,
// 更改引用对象属性的时间 可选值"<as-needed|consistent|preserve>"
quoteProps: 'as-needed',
// 在JSX中使用单引号而不是双引号
jsxSingleQuote: false,
// 多行时尽可能打印尾随逗号。（例如，单行数组永远不会出现逗号结尾。） 可选值"<none|es5|all>"，默认none
trailingComma: 'es5',
// 在对象文字中的括号之间打印空格
bracketSpacing: true,
// jsx 标签的反尖括号需要换行
jsxBracketSameLine: false,
// 在单独的箭头函数参数周围包括括号 always：(x) => x \ avoid：x => x
arrowParens: 'always',
// 这两个选项可用于格式化以给定字符偏移量（分别包括和不包括）开始和结束的代码
rangeStart: 0,
rangeEnd: Infinity,
// 指定要使用的解析器，不需要写文件开头的 @prettier
requirePragma: false,
// 不需要自动在文件开头插入 @prettier
insertPragma: false,
// 使用默认的折行标准 always\never\preserve
proseWrap: 'preserve',
// 指定HTML文件的全局空格敏感度 css\strict\ignore
htmlWhitespaceSensitivity: 'css',
// Vue文件脚本和样式标签缩进
vueIndentScriptAndStyle: false,
// 换行符使用 lf 结尾是 可选值"<auto|lf|crlf|cr>"
endOfLine: 'lf',
// 当箭头函数仅有一个参数时不加括号
arrowParens: 'avoid',
};
3. 代码片断的参数制作
详见：https://www.cnblogs.com/yaopengfei/p/17162646.html
4. JWT相关
详见：https://www.cnblogs.com/yaopengfei/p/17156611.html
5. postman的使用技巧
详见：https://www.cnblogs.com/yaopengfei/p/17165184.html
!
- 作 者 : Yaopengfei(姚鹏飞)
- 博客地址 : http://www.cnblogs.com/yaopengfei/
- 声 明1 : 如有错误，欢迎讨论，请勿谩骂^_^。
- 声 明2 : 原创博客请在转载时保留原文链接或在文章开头加上本人博客地址，否则保留追究法律责任的权利。
