NodeJS入门笔记

Bilibili黑马程序员NodeJS

基于Bilibili黑马程序员NodeJS教程的学习记录

什么是nodejs

nodejs是基于谷歌v8引擎的js解释器,nodejs包含npm,npm是node包管理工具

如何运行js代码

1
2
# 执行当前目录下名为xx.js的js源文件
$ node xx.js

内置模块

nodejs也和chrome的v8一样,有一些内置模块供我们使用

  • fs文件模块

    1
    2
    // 引入fs模块
    const path = require('fs');
  • path路径模块

    1
    2
    // 引入path模块
    const path = require('path');
  • http服务模块

    1
    2
    // 引入http模块
    const http = require('http');

模块化

1
2
3
4
5
6
7
8
9
10
// 1、标准
module.exports = {

};

// 或者
exports.xx = xxx;

// 2、简洁
exports.xx = xxx;

npm使用

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
# 因为npm默认下载包的地址在国外,可以切换国内的镜像源
# 下载镜像源快速切换工具nrm
$ npm install -g nrm

# 查看镜像源列表
$ nrm ls

# 使用列表中的镜像,例:
$ nrm use taobao

# 下载某个包
$ npm install xxxx[@version] [--save]

# 卸载某个包
$ npm uninstall xxxx[@version] [--save]

express

优秀的第三方模块,能够快速开发中间件

路由

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// 文件1
const express = require('express');
const Router = express.Router();
Router.get('path1',func1);
Router.post('path2',func2);
module.exports = Router;

// 文件2
const express = require('express');
const Router = require('./文件1');
const app = express();

app.use('前缀',Router);

app.listen(端口,funciton;

中间件

express在收到请求时会先调用中间件

中间件的调用会根据中间件注册的顺序执行,而且会共用一个res和req,也就是说可以在上游中间件给res对象和req对象加入一些属性或方法供下游中间件使用。

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
const express = require('express');
const app = express();

// 创建中间件
function mw1(req,res,next) {
/*
你的代码
*/
next();
}
function mw2(req,res,next) {
/*
你的代码
*/
next();
}

// 注册全局生效中间件
app.use(mw1);

// 注册局部生效的中间件
app.get('path',mw2,func);

// 注册多个局部生效的中间件
app.get('path',[mw1,mw2],func);
// or
app.get('path',mw1,mw2,func);

注意事项

  • 中间件的注册应当放在路由的前面
  • 中间件函数中的业务完成后应当调用next函数,否则请求会停止在此中间件
  • 中间件函数应当最后调用next函数,不能在next函数调用后还继续写代码,否则会造成代码混乱

中间件的分类

  • 应用级别中间件
    注册在app上的中间件

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    const express = require('express');
    const app = express();

    const mw = (req,res,next) => {
    next();
    }

    // 直接注册在app上
    app.use(mw);

    // 注册在app的路由上
    app.get('path',mw,func);
  • 路由级别中间件

注册在Router上的中间件

1
2
3
4
5
6
7
8
const express = require('express');
const Router = express.Router();

const mw = (req,res,next) => {
next();
}

Router.use(mw);
  • 错误级别中间件

用于处理错误,防止系统崩溃的中间件,一定要在路由后注册

1
2
3
4
5
6
7
8
9
10
11
12
const express = require('express');
const app = express();

// 定义错误中间件,相较于普通中间件多了一个err参数
const mw = (err,req,res,next) => {
next();
}

app.get('path',func);

// 在路由后注册才会有err对象,否则err为undefined
app.use(mw);
  • 内置中间件

express自带的中间件

  • 内置中间件-express.static()

快速托管静态资源

1
2
3
4
const express = require('express');
const app = express();

app.use('prefix',express.static('path'));
  • 内置中间件-express.json()

解析请求体中的json数据

1
2
3
4
5
6
7
8
9
10
11
const express = require('express');
const app = express();

app.use(express.json());

// 通过req对象的body属性获取
app.get('path',(req,res) => {
let body = req.body;
console.log(body);
res.send(body);
});
  • 内置中间件-express.urlencoded()

解析请求体中url-www-extended(好像叫这个吧,忘了)的数据

1
2
3
4
5
6
7
8
9
10
11
12
13
14
const express = require('express');
const app = express();

// 传入一个对象(我也不太清楚什么意思)
app.use(express.urlencoded({
extended: false;
}));

// 通过req对象的body属性获取
app.get('path',(req,res) => {
let body = req.body;
console.log(body);
res.send(body);
});
  • 第三方中间件

别人写的优秀的第三方中间件,例如body-parser,但是express@4.16.0以后就自带了这个东西
就是express.urlencoded(),它是基于body-parser的封装
首先要下载body-parser包

1
$ npm install body-parser --save

使用方法与express.encoded()差不多

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
const express = require('express');
const bodyParser = require('body-parser');
const app = express();

// 传入一个对象(我也不太清楚什么意思)
app.use(bodyParser.urlencoded({
extended: false;
}));

// 通过req对象的body属性获取
app.get('path',(req,res) => {
let body = req.body;
console.log(body);
res.send(body);
});

跨域问题

什么是跨域问题

在浏览器控制台中会出现类似以下的报错

1
Access to XMLHttpRequest at 'http://127.0.0.1/api/get?id=2206831544&name=%E9%A9%AC%E6%9F%90&gender=%E7%94%B7' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

协议、域名、端口号的不同导致的跨域问题

解决方案

CORS(主流的解决方案,推荐使用)
JSONP(有缺陷的解决方案,只支持get请求)

使用cors第三方中间件

cors是express解决跨域问题的第三方中间件

1
2
# 下载cors第三方包
$ npm install cors --save
1
2
3
4
5
6
7
8
const express = require('express');
const cors = require('cors');
const app = express();

// 在引入路由之前注册cors中间件
app.use(cors());

// 在此写入路由

指定域名通过跨域请求

1
2
3
4
5
6
7
8
9
10
11
// 指定http://19maken.top才能跨域访问
res.setHeader('Access-Control-Allow-Origin','http://19maken.top');

// 指定所有域名都能跨域访问
res.setHeader('Access-Control-Allow-Origin','*');

// 指定请求允许的请求方法
res.setHeader('Access-Control-Allow-Methods','POST,GET,DELETE,HEAD');

// 指定允许所有的请求
res.setHeader('Access-Control-Allow-Methods','*');

预检请求
有些请求不是简单请求,会先发送OPTION请求进行预检

jsonp

这个东西我也不太清楚,说是要如果配置了cors,就要配置在cors的前面,然后前端会使用script标签来解析响应的内容。

mysql模块

这也是第三方模块,用于数据库的连接与操作。

1
2
# 下载第三方包
$ npm install mysql

导入mysql模块并使用

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
// 导入mysql第三方包
const mysql = require('mysql');

// 创建连接
const connection = mysql.createConnection({
host: 'localhost',
user: 'user',
password: 'secret',
database: 'database'
});

// 连接
connection.connect();

// 操作连接
const sql = 'SELECT 1+1 AS solution';
connection.query(sql,function(error,results,fields) {
if (error) throw error;
console.log('The solution is:', results[0],solution);
});

// 关闭连接
connection.end();

使用带占位符的sql语句,PS:占位符使用?

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
// 1、多个占位符,使用数据传数据
const sql = 'SELECT * FROM table WHERE age > ? and gender = ?';
connection.query(sql,[18,'男'],function(error,results,fields) {
if (error) throw error;
console.log(results);
});

// 2、如果占位符太多,可以使用对象
const sql = 'INSERT INTO table (fields) values (?)';
const data = {
field1: field1,
field2: field2,
...
}
connection.query(sql,data,function(error,results,fields) {
if (error) throw error;
// 查看受影响的行数
console.log(results.affectedRows);
});

// 3、如果只有一个占位符,那么就可以不用使用数组传数据,直接使用数据
const sql = 'SELECT * FROM table WHERE age > ?';
connection.query(sql,18,function(error,results,fields) {
if (error) throw error;
console.log(results);
});

注意事项

在执行操作的时候,如果执行的语句是查询语句,那么results就是一个数组,如果执行的是一个更新语句或者是删除语句,那么results就是一个对象,其中results的affectedRows属性可以查看执行后的语句所影响的行数。

Web开发模式

SEO?

服务端渲染

对SEO友好,但对服务器压力过大

前后端分离

服务器压力小,不用渲染页面,前端注重页面,后端注重API,对SEO不友好,但能使用VUE等框架提供的服务

如何选择?

不同的场景使用不同的模式,例如管理系统不怎么需要SEO,就可以使用前后端分离。有些网站也采用首页使用服务端渲染,其他页面使用前后端分离。

身份验证

  • 服务端渲染推荐使用Session认证机制。

使用Cookie,它是存储在用户浏览器中一段不超过4KB的字符串,由一个名称(name)、一个值(value)和其他几个用于控制Cookie有效期、安全性和使用范围的可选属性组成。每当发起请求,会将未过期的Cookie一同发送到对应域名的服务器。服务端可以通过响应头发送Cookie给客户端。但是Cookie不安全,因为谁都可以看,会很好仿造。所以使用Cookie+Session认证。因为Session中的数据是对应客户端的客户端只能访问属于自己的session数据,而不能访问别的客户端的session数据。

  • 前后端分离推荐使用JWT认证机制。

在Express中使用Session认证

下载express-session中间件

1
$ npm install express-session

注册express-session中间件

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
var express = require('express');
var session = require('express-session');
var app = express();

app.use(session({
secret: 'keyboard cat', // secret属性的值可以为任意字符串
resave: false, // 固定写法
saveUninitialized: true // 固定写法
}));

app.get('/user/login',function(req,res) {
// 往session中存储数据
req.session.xxx1 = xxx1;
req.session.xxx2 = xxx2;
res.send('success');
});

app.get('/user/getXxx',function(req,res) {
// 取session中的数据
res.send(req.session.xxx1 + '\n' + req.session.xxx2);
});

app.get('/user/logout',function(req,res) {
// 清空Session中的数据
req.session.destroy();
res.send('success');
});

JWT跨域认证

由于Cookie默认不支持跨域,如果使用Session+Cookie作为身份验证机制,配置会很麻烦。JWT(JSON Web Token)是目前最流行的跨域认证解决方案。

JWT工作流程

首先客户端(浏览器)会发送登陆请求,服务器接收到请求后先验证账号和密码,验证通过后会将用户的信息对象经过加密后生成Token字符串(服务端不会存储这个字符串),然后响应给客户端,客户端收到响应后会将Token存放在浏览器的LocalStorage或者SessionStorage中,当客户端再次发送请求的时候会通过请求头的Authorization字段将Token发送给服务器,服务器验证这个Token是否合法,解析为之前打包所对应的数据,然后针对数据发送对应的响应。JWT中不要携带密码信息

JWT组成部分,三部分,使用“.”分隔

Header(头部).Payload(有效荷载).Signature(签名)

Header与Signature只与安全有关,防止破解。Payload是加密后的用户信息。

客户端如何使用JWT?

1
2
# 推荐做法:将JWT放在HTTP请求同的Authorization字段中。
Authorization: Bearer <token>

在Express中使用JWT

安装JWT相关的包

jsonwebtoken 用于生成JWT字符串

express-jwt 用于将JWT字符串解析还原成JSON数据包

1
2
# 安装如下两个JWT相关的包
$ npm install jsonwebtoken express-jwt

定义secret密钥:用于JWT加密与解密,建议命名为secretKey

使用方法

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
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
const express = require('express');
const jwt = require('jsonwebtoken');
// 新版使用方法(7.7.7),expressJWT为接收变量名,可任意更换
var {expressjwt: expressJWT} = require('express-jwt');
const app = express();

// 定义secret密钥(随意字符串)
const secretKey = 'XXXX xxxx II';

// 配置JWT解析中间件
// 这个algorithms必须配置,好像是配置加密算法
// expressJWT({}):配置解析
// expressJWT({}).unless({}):配置哪些不使用解析
// 添加expressJWT中间件后,express会将解析的token信息挂载在req.user中
app.use(expressJWT({
secret: secretKey,
algorithms: ["HS256"]
}).unless({
path: [/^\/api\//]
}));
// 解析请求体JSON数据
app.use(express.json());

app.post('/api/user/login/action',function(req,res) {
const user = req.body;
if (user.name === 'admin' && user.pwd === '123456') {
console.log('登陆成功!');
// 参数1:加密信息,必须为一个对象!
// 参数2:加密密钥
// 参数3:配置,有很多参数,这里只配置了token有效期为30秒
const tokenStr = jwt.sign({username: user.name},secretKey,{expiresIn: '30s'});

res.send({
status: 200,
message: '登陆成功!',
token: tokenStr
});
} else {
console.log('登陆失败!');
res.send({
status: 200,
message: '登陆失败!',
token: null
});
}
});

// 请求此接口时应该在请求头的Authorization中添加token信息
app.get('/user/info',function(req,res) {
const user = req.user;
// username为之前生成token时需要打包的数据中的字段
if (user.username === admin) {
res.send({
code: 200,
msg: '请求成功!',
data: {
name: 'admin',
age: 19
}
});
}
});

// 添加token解析异常中间件处理
app.use((err,req,res,next) => {
if (err.name === 'UnauthorizedError') {
return res.send({
code: 401,
msg: '无效的token',
});
}

// 如果不是token错误
res.send({
code: 500,
msg: '未知的错误',
});
});