Node.js 补充
前言
参考：Node.js
初识 Node.js
使用 Node.js 运行 js 文件
输入：node 要执行的js文件的路径
cmd 中快捷键：Tab 快速补全、Esc 快速情况当前输入的命令
Node.js 中的 fs 模块
fs.readFile
1 | const fs = require('fs') // 注意不能使用 import fs from 'fs'; |
path：文件路径（必选）
options：配置选项，若是字符串则指定编码格式 （可选）
- encoding：编码格式
- flag：打开方式
callback：回调函数 （必选）
- err：错误信息
- data：读取的数据，如果未指定编码格式则返回一个 Buffer
1 | // 1. 导入 fs 模块，来操作文件 |
fs.writeFile
1 | fs.writeFile(file, data[, options], callback) |
- file：文件路径
- data：写入内容
- options：配置选项，包含 encoding, mode, flag；若是字符串则指定编码格式
- callback：回调函数
1 | fs.writeFile('./files/3.txt', 'ok123', function(err) { |
Node.js 中的 path 模块
1 | 在 node 中 路径问题： |
path.jion 与 path.resolve
1 | console.log(__dirname) // 得到的是当前文件所在目录的绝对路径 |
获取路径中文件名 path.basename
1 | // 获取路径中的最后一部分，常通过该方法获取路径中的文件名 |
path.extname
1 | path.extname(path) |
http 模块
1 | // 1. 导入 http 模块 |
Node 中的模块化
1 | /* 默认情况下，exports 和 module.exports 指向同一个对象。最终结果，以 module.exports 指向的对象为准。 |
npm
包的语义化版本规范
1 | 包的版本号是以“点分十进制”形式进行定义的，总共有三位数字 |
包管理配置文件
1 | npm init -y // 生成 package.json 配置文件 |
切换 npm 的下包镜像源
1 | #查看当前下载包镜像源 |
nrm 的使用
1 | 1.全局安装 nrm |
发布包
一个规范的包必须符合以下 3 点要求：
① 包必须以单独的目录而存在
② 包的顶级目录下要必须包含 package.json 这个包管理配置文件
③ package.json 中必须包含 name，version，main 这三个属性，分别代表包的名字、版本号、包的入口文件。
发布流程
新建package.json、index.js、README.md 三个文件
1
2
3
4
5
6
7
8
9
10// package.json 文件
{
"name": "npm-moxie-heima", // 名称
"version": "1.0.0", // 版本
"description": "包的描述信息", // 描述信息
"main": "index.js", // 入口文件
"keywords": ["moxie"], // 关键字
"author": "", // 作者
"license": "ISC" // 协议：https://www.jianshu.com/p/86251523e898
}登录 npm 账号
npm 账号注册完成后
终端中执行
npm login命令，依次输入用户名、密码、邮箱后，即可登录成功。注意：在运行
npm login命令之前，必须先把下包的服务器地址切换为 npm 的官方服务器。否则会导致发布包失败！使用
npm config get registry查看下载地址https://registry.npmmirror.com/使用
npm config set registry https://registry.npmjs.org/切换到官方地址把包发布到 npm 上
将终端切换到包的根目录之后，运行
npm publish命令，即可将包发布到 npm 上注意：包名不能雷同
删除发布的包
运行
npm unpublish 包名 --force命令，即可从 npm 删除已发布的包。①
npm unpublish命令只能删除 72 小时以内发布的包②
npm unpublish删除的包，在 24 小时内不允许重复发布③ 发布包的时候要慎重，尽量不要往 npm 上发布没有意义的包！
其他命令
1
2
3
4
5
6
7
8npm whoami // npm 查看用户信息
npm logout // npm 退出
npm publish --access public // 发布包
// 表示包访问权限
// --access public 设置包开放
// --access restricted 设置包私有
// 注: npm 可发布最小单位是 package.json 一个文件，只有登录后才可以发布 npm 包
npm unpublish 包名 --force // npm撤销发布的包
Express
基本使用
安装 Express：npm install express
1 | const express = require('express') |
托管静态资源
- 通过
express.static()方法可创建静态资源服务器，向外开放访问静态资源。 - Express 在指定的静态目录中查找文件，并对外提供资源的访问路径，存放静态文件的目录名不会出现在URL 中
- 访问静态资源时，会根据托管顺序查找文件
- 可为静态资源访问路径添加前缀
1 | app.use(express.static('public')) |
模块化路由
为了方便对路由进行模块化的管理，Express 不建议将路由直接挂载到 app 上，而是推荐将路由抽离为单独的模块。
将路由抽离为单独模块的步骤如下：
① 创建路由模块对应的 .js 文件
② 调用 express.Router() 函数创建路由对象
③ 向路由对象上挂载具体的路由
④ 使用 module.exports 向外共享路由对象
⑤ 使用 app.use() 函数注册路由模块
1 | // router.js |
1 | const express = require('express') |
Express 中间件
- 中间件是指流程的中间处理环节
- 服务器收到请求后，可先调用中间件进行预处理
- 中间件是一个函数，包含 req, res, next 三个参数，next() 参数把流转关系交给下一个中间件或路由
中间件注意事项：
- 在注册路由之前注册中间件（错误级别中间件除外）
- 中间件可连续调用多个
- 别忘记调用 next() 函数
- next() 函数后别写代码
- 多个中间件共享 req、res对象
全局中间件
1 | const express = require('express') |
局部中间件
1 | const express = require('express') |
中间件分类
应用级别的中间件
- 通过 app.use() 或 app.get() 或 app.post() ，绑定到 app 实例上的中间件。
路由级别的中间件
绑定到 express.Router() 实例上的中间件，叫做路由级别的中间件。用法和应用级别中间件没有区别。应用级别中间件是绑定到 app 实例上，路由级别中间件绑定到 router 实例上。
1
2
3
4
5
6
7
8
9const app = express()
const router = express.Router()
router.use(function (req, res, next) {
console.log(1)
next()
})
app.use('/', router)
错误级别的中间件
- 用来捕获整个项目中发生的异常错误，从而防止项目异常崩溃的问题
- 错误级别中间件的处理函数中，必须有 4 个形参，形参顺序从前到后分别是 (err, req, res, next) 。
- 错误级别的中间件必须注册在所有路由之后。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17const express = require('express')
const app = express()
app.get('/', (req, res) => {
throw new Error('服务器内部发生了错误！')
res.send('Home page.')
})
// 定义错误级别的中间件，捕获整个项目的异常错误，从而防止程序的崩溃
app.use((err, req, res, next) => {
console.log('发生了错误！' + err.message)
res.send('Error：' + err.message)
})
app.listen(80, function () {
console.log('Express server running at http://127.0.0.1')
})Express 内置中间件
自 Express 4.16.0 版本开始，Express 内置了 3 个常用的中间件，极大的提高了 Express 项目的开发效率和体验：
- express.static 快速托管静态资源的内置中间件，例如： HTML 文件、图片、CSS 样式等（无兼容性）
- express.json 解析 JSON 格式的请求体数据（有兼容性，仅在 4.16.0+ 版本中可用）
- express.urlencoded 解析 URL-encoded 格式的请求体数据（有兼容性，仅在 4.16.0+ 版本中可用）
1
2
3
4
5
6
7
8
9
10
11
12// 注意：除了错误级别的中间件，其他的中间件，必须在路由之前进行配置
// 通过 express.json() 这个中间件，解析表单中的 JSON 格式的数据
app.use(express.json())
// 通过 express.urlencoded() 这个中间件，来解析 表单中的 url-encoded 格式的数据
app.use(express.urlencoded({ extended: false }))
app.post('/user', (req, res) => {
// 在服务器，可以使用 req.body 这个属性，来接收客户端发送过来的请求体数据
// 默认情况下，如果不配置解析表单数据的中间件，则 req.body 默认等于 undefined
console.log(req.body)
res.send('ok')
})1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40// 自定义中间件
/* 一. custom-body-parser.js ---------------*/
// 导入 Node.js 内置的 querystring 模块
const qs = require('querystring')
const bodyParser = (req, res, next) => {
// 定义中间件具体的业务逻辑
// 1. 定义一个 str 字符串，专门用来存储客户端发送过来的请求体数据
let str = ''
// 2. 监听 req 的 data 事件
req.on('data', (chunk) => {
str += chunk
})
// 3. 监听 req 的 end 事件
req.on('end', () => {
// 在 str 中存放的是完整的请求体数据
// console.log(str)
// TODO: 把字符串格式的请求体数据，解析成对象格式
const body = qs.parse(str)
req.body = body
next()
})
}
module.exports = bodyParser
/* 二、main.js --------------- */
// 导入 express 模块
const express = require('express')
// 创建 express 的服务器实例
const app = express()
// 1. 导入自己封装的中间件模块
const customBodyParser = require('./custom-body-parser')
// 2. 将自定义的中间件函数，注册为全局可用的中间件
app.use(customBodyParser)
app.post('/user', (req, res) => {
res.send(req.body)
})
// 调用 app.listen 方法，指定端口号并启动web服务器
app.listen(80, function () {
console.log('Express server running at http://127.0.0.1')
})第三方中间件
CORS 跨域资源共享
cors 中间件解决跨域
- 安装中间件：
npm install cors - 导入中间件：
const cors = require('cors') - 配置中间件：
app.use(cors())
CORS
- CORS（Cross-Origin Resource Sharing，跨域资源共享）解决跨域，是通过 HTTP 响应头决定浏览器是否阻止前端 JS 代码跨域获取资源
- 浏览器的同源安全策略默认会阻止网页“跨域”获取资源。但如果接口服务器配置了 CORS 相关的 HTTP 响应头，就可解除浏览器端的跨域访问限制
- CORS 主要在服务器端进行配置。客户端浏览器无须做任何额外的配置，即可请求开启了 CORS 的接口。
- CORS 在浏览器中有兼容性。只有支持 XMLHttpRequest Level2 的浏览器，才能正常访问开启了 CORS 的服务端接口（例如：IE10+、Chrome4+、FireFox3.5+）。
CORS 常见响应头
Access-Control-Allow-Origin：制定了允许访问资源的外域 URL
1 | res.setHeader('Access-Control-Allow-Origin', 'http://bruceblog.io') |
Access-Control-Allow-Headers
- 默认情况下，CORS 仅支持客户端向服务器发送如下的 9 个请求头：
Accept、Accept-Language、Content-Language、DPR、Downlink、Save-Data、Viewport-Width、Width 、Content-Type （值仅限于 text/plain、multipart/form-data、application/x-www-form-urlencoded 三者之一） - 如果客户端向服务器发送了额外的请求头信息，则需要在服务器端，通过
Access-Control-Allow-Headers对额外的请求头进行声明，否则这次请求会失败！
1 | res.setHeader('Access-Control-Allow-Headers', 'Content-Type') |
Access-Control-Allow-Methods
- 默认情况下，CORS 仅支持客户端发起 GET、POST、HEAD 请求。如果客户端希望通过 PUT、DELETE 等方式请求服务器的资源，则需要在服务器端，通过
Access-Control-Alow-Methods来指明实际请求所允许使用的 HTTP 方法
1 | res.setHeader('Access-Control-Allow-Methods', 'POST, GET, DELETE, HEAD') |
CORS 请求分类
简单请求
- 请求方式：GET、POST、HEAD 三者之一
- HTTP 头部信息不超过以下几种字段：无自定义头部字段、
Accept、Accept-Language、Content-Language、DPR、Downlink、Save-Data、Viewport-Width、Width 、Content-Type（只有三个值 application/x-www-formurlencoded、multipart/form-data、text/plain）
预检请求
- 请求方式为 GET、POST、HEAD 之外的请求 Method 类型
- 请求头中包含自定义头部字段
- 向服务器发送了 application/json 格式的数据
在浏览器与服务器正式通信之前，浏览器会先发送 OPTION 请求进行预检，以获知服务器是否允许该实际请求，所以这一次的 OPTION 请求称为“预检请求”。服务器成功响应预检请求后，才会发送真正的请求，并且携带真实数据
数据库与身份验证
数据库
数据库（database）是用来组织、存储和管理数据的仓库。
分类
- MySQL 数据库（目前使用最广泛、流行度最高的开源免费数据库；Community + Enterprise）
- Oracle 数据库（收费）
- SQL Server 数据库（收费）
- Mongodb 数据库（Community + Enterprise）
其中，MySQL、Oracle、SQL Server 属于传统型数据库（又叫做：关系型数据库 或 SQL 数据库），这三者的设计理念相同，用法比较类似。而 Mongodb 属于新型数据库（又叫做：非关系型数据库 或 NoSQL 数据库），它在一定程度上弥补了传统型数据库的缺陷。
mysql 的安装
只需要安装 MySQL Server 和 MySQL Workbench 这两个软件，就能满足开发的需要了。
- MySQL Server：专门用来提供数据存储和服务的软件。
- MySQL Workbench：可视化的 MySQL 管理工具，通过它，可以方便的操作存储在 MySQL Server 中的数据
也可以使用集成环境 laragon、phpstudy 等包含了 mysql，再配合 navicat 等
sql 语句使用
SQL（英文全称：Structured Query Language）是结构化查询语言，专门用来访问和处理数据库的编程语言。能够让我们以编程的形式，操作数据库里面的数据。
三个关键点：
- SQL 是一门数据库编程语言
- 使用 SQL 语言编写出来的代码，叫做 SQL 语句
- SQL 语言只能在关系型数据库中使用（例如 MySQL、Oracle、SQL Server）。非关系型数据库（例如 Mongodb）不支持 SQL 语言
注意：SQL 语句中的关键字对大小写不敏感。SELECT 等效于 select，FROM 等效于 from。
WHERE 子句中使用的运算符
| 操作符 | 描述 |
|---|---|
| = | 等于 |
| <> | 不等于 |
| > | 大于 |
| < | 小于 |
| >= | 大于等于 |
| <= | 小于等于 |
| BETWEEN | 在某个范围内 |
| LIKE | 搜索某种模式 |
注意：在某些版本的 SQL 中，操作符 <> 可以写为 !=
1 | -- 这是注释 |
举例使用
1 | -- 通过 * 把 users 表中所有的数据查询出来 |
mysql 模块
配置 mysql 模块
安装 mysql 模块
npm install mysql建立连接
1
2
3
4
5
6
7
8const mysql = require('mysql')
const db = mysql.createPool({
host: '127.0.0.1',
user: 'root',
password: 'root',
database: 'test',
})测试是否正常工作
1
2
3
4db.query('select 1', (err, results) => {
if (err) return console.log(err.message)
console.log(results)
})
操作 mysql 数据库
查询数据
1
2
3db.query('select * from users', (err, results) => {
...
})插入数据
1
2
3
4
5
6
7// ? 表示占位符
const sql = 'insert into users values(?, ?)'
// 使用数组的形式为占位符指定具体的值
db.query(sql, [username, password], (err, results) => {
if (err) return console.log(err.message)
if (results.affectedRows === 1) console.log('插入成功')
})向表中新增数据时，如果数据对象的每个属性和数据表的字段一一对应，则可以通过如下方式快速插入数据：
1
2
3
4
5const user = {username:'Bruce', password:'55520'}
const sql = 'insert into users set ?'
db.query(sql, user, (err, results) => {
...
})更新数据
1
2
3
4const sql = 'update users set username=?, password=? where id=?'
db.query(sql, [username, password, id], (err, results) => {
...
})快捷方式：
1
2
3
4
5const user = {id:7,username:'Bruce',password:'55520'}
const sql = 'update users set ? where id=?'
db.query(sql, [user, user.id], (err, results) => {
...
})删除数据
1
2
3
4const sql = 'delete from users where id=?'
db.query(sql, id, (err, results) => {
...
})使用 delete 语句会真正删除数据，保险起见，使用标记删除的形式，模拟删除的动作。即在表中设置状态字段，标记当前的数据是否被删除。
1
2
3db.query('update users set status=1 where id=?', 7, (err, results) => {
...
})
Web 开发模式
服务端渲染
服务器发送给客户端的 HTML 页面，是在服务器通过字符串的拼接动态生成的。因此客户端不需要使用 Ajax 额外请求页面的数据。
1 | app.get('/index.html', (req, res) => { |
优点：
- 前端耗时短。浏览器只需直接渲染页面，无需额外请求数据。
- 有利于 SEO。服务器响应的是完整的 HTML 页面内容，有利于爬虫爬取信息。
缺点：
- 占用服务器资源。服务器需要完成页面内容的拼接，若请求比较多，会对服务器造成一定访问压力。
- 不利于前后端分离，开发效率低。
前后端分离
前后端分离的开发模式，依赖于 Ajax 技术的广泛应用。后端只负责提供 API 接口，前端使用 Ajax 调用接口。
优点：
- 开发体验好。前端专业页面开发，后端专注接口开发。
- 用户体验好。页面局部刷新，无需重新请求页面。
- 减轻服务器的渲染压力。页面最终在浏览器里生成。
缺点：
- 不利于 SEO。完整的 HTML 页面在浏览器拼接完成，因此爬虫无法爬取页面的有效信息。Vue、React 等框架的 SSR（server side render）技术能解决 SEO 问题。
如何选择
- 企业级网站，主要功能是展示，没有复杂交互，且需要良好的 SEO，可考虑服务端渲染
- 后台管理项目，交互性强，无需考虑 SEO，可使用前后端分离
- 为同时兼顾首页渲染速度和前后端分离开发效率，可采用首屏服务器端渲染+其他页面前后端分离的开发模式
身份认证
Session 认证机制
服务端渲染推荐使用 Session 认证机制
Session 工作原理
Express 中使用 Session 认证
安装 express-session 中间件 npm install express-session
配置中间件
1
2
3
4
5
6
7
8const session = require('express-session')
app.use(
session({
secret: 'Bruce', // secret 的值为任意字符串
resave: false,
saveUninitalized: true,
})
)向 session 中存数据
中间件配置成功后，可通过
req.session访问 session 对象，存储用户信息1
2
3
4
5
6app.post('/api/login', (req, res) => {
req.session.user = req.body
req.session.isLogin = true
res.send({ status: 0, msg: 'login done' })
})从 session 取数据
1
2
3
4
5
6app.get('/api/username', (req, res) => {
if (!req.session.isLogin) {
return res.send({ status: 1, msg: 'fail' })
}
res.send({ status: 0, msg: 'success', username: req.session.user.username })
})清空 session
1
2
3
4
5app.post('/api/logout', (req, res) => {
// 清空当前客户端的session信息
req.session.destroy()
res.send({ status: 0, msg: 'logout done' })
})
JWT 认证机制
前后端分离推荐使用 JWT（JSON Web Token）认证机制，是目前最流行的跨域认证解决方案
JWT 工作原理
Session 认证的局限性：
- Session 认证机制需要配合 Cookie 才能实现。由于 Cookie 默认不支持跨域访问，所以，当涉及到前端跨域请求后端接口的时候，需要做很多额外的配置，才能实现跨域 Session 认证。
- 当前端请求后端接口不存在跨域问题的时候，推荐使用 Session 身份认证机制。
- 当前端需要跨域请求后端接口的时候，不推荐使用 Session 身份认证机制，推荐使用 JWT 认证机制
JWT 工作原理图：
用户的信息通过 Token 字符串的形式，保存在客户端浏览器中。服务器通过还原 Token 字符串的形式来认证用户的身份。
JWT 组成部分：
- Header、Payload、Signature
- Payload 是真正的用户信息，加密后的字符串
- Header 和 Signature 是安全性相关部分，保证 Token 安全性
- 三者使用
.分隔
Header.Payload.Signature
JWT 使用方式：
客户端会把 JWT 存储在 localStorage 或 sessionStorage 中
此后客户端与服务端通信需要携带 JWT 进行身份认证，将 JWT 存在 HTTP 请求头 Authorization 字段中
加上 Bearer 前缀
1
Authorization: Bearer <token>
Express 使用 JWT
安装
npm install jsonwebtoken express-jwt- jsonwebtoken 用于生成 JWT 字符串
- express-jwt 用于将 JWT 字符串解析还原成 JSON 对象
定义 secret 密钥
- 为保证 JWT 字符串的安全性，防止其在网络传输过程中被破解，需定义用于加密和解密的 secret 密钥
- 生成 JWT 字符串时，使用密钥加密信息，得到加密好的 JWT 字符串
- 把 JWT 字符串解析还原成 JSON 对象时，使用密钥解密
1
2
3
4
5const jwt = require('jsonwebtoken')
const expressJWT = require('express-jwt')
// 密钥为任意字符串
const secretKey = 'Bruce'生成 JWT 字符串
1
2
3
4
5
6
7
8
9
10
11app.post('/api/login', (req, res) => {
...
res.send({
status: 200,
message: '登录成功',
// jwt.sign() 生成 JWT 字符串
// 参数：用户信息对象、加密密钥、配置对象-token有效期
// 尽量不保存敏感信息，因此只有用户名，没有密码
token: jwt.sign({username: userInfo.username}, secretKey, {expiresIn: '10h'})
})
})JWT 字符串还原为 JSON 对象
- 客户端访问有权限的接口时，需通过请求头的 Authorization 字段，将 Token 字符串发送到服务器进行身份认证
- 服务器可以通过 express-jwt 中间件将客户端发送过来的 Token 解析还原成 JSON 对象
1
2// unless({ path: [/^\/api\//] }) 指定哪些接口无需访问权限
app.use(expressJWT({ secret: secretKey }).unless({ path: [/^\/api\//] }))获取用户信息
当 express-jwt 中间件配置成功后，即可在那些有权限的接口中，使用 req.user 对象，来访问从 JWT 字符串中解析出来的用户信息
1
2
3
4
5
6
7
8app.get('/admin/getinfo', (req, res) => {
console.log(req.user)
res.send({
status: 200,
message: '获取信息成功',
data: req.user,
})
})
捕获解析 JWT 失败后产生的错误
- 当使用 express-jwt 解析 Token 字符串时，如果客户端发送过来的 Token 字符串过期或不合法，会产生一个解析失败的错误，影响项目的正常运行
- 通过 Express 的错误中间件，捕获这个错误并进行相关的处理
1
2
3
4
5
6app.use((err, req, res, next) => {
if (err.name === 'UnauthorizedError') {
return res.send({ status: 401, message: 'Invalid token' })
}
res.send({ status: 500, message: 'Unknown error' })
})
本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 moxieBlog！
相关推荐