Express核心

一、Experss开篇

1.什么是express

Express是一个基于NodeJS的Web Server开发框架, 能够帮助我们快速的搭建Web服务器

2.为什么需要Express

1.利用原生的NodeJS开发Web服务器,
我们需要处理很多繁琐且没有技术含量的内容
例如: 获取路由->解析路由->分配路由->处理路由等
但是有了Express之后, 就能帮助我们省去大量繁琐的环节, 让我们只用关注核心业务逻辑
2.利用原生的NodeJS开发Web服务器,
我们需要自己手动去实现静态/动态资源处理, get/post参数的解析, cookie的解析, 日志处理等
但是有了Express之后, 已经有现成的插件帮我们实现了上述功能
3.所以作为单身的程序猿(媛), 如果你还想留一些时间去约会, 那么Express是你的最佳选择

3.如何使用Express

1.手动安装手动配置
2.利用Express脚手架工具安装使用(Express-generator)

4.手动安装手动配置

https://www.npmjs.com/package/express
安装：npm i express -S

二、Express基本使用

//1.导入express
const express = require('express');
// 2.调用express方法, 创建服务端实例对象
const app = express()
app.get('/', (req, res, next)=>{
res.writeHead(200, {
	'Content-Type': 'text/plain; charset=utf-8;'
});
res.end('www.baidu.com');
});
// 3.告诉服务端需要监听哪一个端口
app.listen(3000, ()=>{
	console.log('listen ok');
});

三、处理静态网页

1.导入express

const express = require('express');
const path = require('path');

2.用express方法, 创建服务端实例对象

const app = express();

3.处理静态资源

//可以配置多个静态资源目录
app.use(express.static('public'))
// app.use(express.static('files'))
// app.use('/static', express.static('files'))
app.use(express.static(path.join(__dirname, 'public')));
app.get('/', (req, res, next)=>{
	res.writeHead(200, {
		'Content-Type': 'text/plain; charset=utf-8;'
	});
	res.end('www.baidu.com');
});

4.告诉服务端需要监听哪一个端口

app.listen(3000, ()=>{
	console.log('listen ok');
});

四、处理动态网页

1.ejs

EJS是一个简单高效的模板语言，通过数据和模板，可以生成HTML标记文本。可以说EJS是一个
JavaScript库，EJS可以同时运行在客户端和服务器端，客户端安装直接引入文件即可，服务器端用
npm包安装。

ejs的特点

• 快速编译和渲染
• 简单的模板标签
• 自定义标记分隔符
• 支持文本包含
• 支持浏览器端和服务器端
• 模板静态缓存
• 支持express视图系统

ejs的成员函数
Render(str,data,[option]):直接渲染字符串并生成html
str：需要解析的字符串模板
data：数据
option：配置选项
ejs的常用标签
<% %>流程控制标签
<%= %>输出标签（原文输出HTML标签）
<%- %>输出标签（HTML会被浏览器解析）
<%# %>注释标签
% 对标记进行转义

2.导入express

const express = require('express');
const path = require('path');

3. 调用express方法, 创建服务端实例对象

const app = express();

4.处理资源

// 处理静态资源
app.use(express.static(path.join(__dirname, 'public')));
// 处理动态资源
// 1.告诉express动态资源存储在什么地方
app.set('views', path.join(__dirname, 'views'));
// 2.告诉express动态网页使用的是什么模板引擎
app.set('view engine', 'ejs');
// 3.监听请求, 返回渲染之后的动态网页
app.get('/', (req, res, next)=>{
	// 注意点: express给请求对象和影响对象添加了很多自定义的方法
	res.render('index', {msg:'www.dadaima.com'});
});

5.告诉服务端需要监听哪一个端口

app.listen(3000, ()=>{
	console.log('listen ok');
});

五、处理路由

1.处理路由方式一

// 通过express处理路由方式一
app.get('/api/goods/list', (req, res, next)=>{
	res.end('goods.list.get');
});
app.get('/api/user/login', (req, res, next)=>{
	res.json({
		name:'wc',
		age:22,
		method: 'get'
	});
});
app.post('/api/goods/detail', (req, res, next)=>{
	res.end('goods.detail.post');
});
app.post('/api/user/register', (req, res, next)=>{
	res.json({
		name:'xq',
		age:18,
		method: 'post'
	});
});

注意点
1.响应对象的json方法是express给响应对象扩展的
2.这个方法会自动将对象转换成字符串之后返回
3.这个方法还会自动帮助我们设置响应头

2.处理路由方式二

(1)引入独立的模块

const userRouter = require('./router/user');

(2)定向到导入模块

app.use('/api/user', userRouter);

六、会话技术

B/S架构中：从浏览器第一次给服务器发送请求时，建立会话；直到有一方断开，会话结束。
一次会话：包含多次请求响应。
问题： Http是一个无状态协议，同一个会话的连续两个请求相互独立，彼此并不了解

客户端会话技术：cookie
服务器端会话技术：session

作用：用于存储浏览器与服务器在请求和响应过程中产生的数据在一次会话中(多次请求响应), 共享数据

1.cookie的使用

Cookie作用： 在一次会话的多次请求之间共享数据，将数据保存到客户端（浏览器）。

---

服务器可以给客户端种植一个cookie：
cookie: 小甜点 饼干 cookie本质就是存储数据的
服务器给客户端种植了一个cookie，那么这个cookie就存储在客户端。
一旦种植了，后面每一次请求，都会带上这个cookie。

问： 服务器给客户端种植了一个cookie，cookie保存在什么地方？
答： 在开发者工具中，找到application，在左侧找到cookie选项，服务器种植的cookie就存在在这个地
方。

---

Cookie的特点：

1. cookie保存在客户端(浏览器), 往往是由服务器产生发送给浏览器
2. cookie只能保存字符串, 格式是entry(name : value)
3. cookie的大小有限制: 4k
4. 一般, 同一域名下的cookie限制数量50个

代码如下：

const express = require("express")
const path = require("path")
const cookieParser = require('cookie-parser')
let app = express();
app.use(express.static(path.join(__dirname,'public')))
// 配置cookie
app.use(cookieParser())
app.get("/",(req,res)=>{
	// 需要在服务端种植一个cookie，种到了浏览器的时面
	// 后面，每一次请求，浏览器都会带上这个cookie
	// 给客户端种植一个cookie
	// res.cookie("usrename","wangcai"); // 默认情况下，会话结束，cookie就死了
	// 活7天 设置cookie的生存时间
	// res.cookie("username","wc",{maxAge:60000*60*24*7})
	// 获取浏览器带过来的cookie
	console.log("获取cookie:",req.cookies);
	res.send("hello 客户端~")
})
app.listen(3000,()=>{
	console.log("server is running 3000~");
})

cookie 总结：
默认cookie的生存时间：
种植：res.cookie(“username”,“wangcai”);当浏览器关闭后，cookie就没了，这个过程，叫一次会话。默认情况下，会话结束了，cookie就没有了。
第一次，会种植一个cookie，后面再次去请求服务器时，它会把cookie携带上。

使用cookie的缺点：
1）除了第1次请求服务器，后面每一次请求服务器，都要带上cookie，浪费带宽，请求速度会慢一点。
2）因为cookie是存在浏览器端的，我们可以销毁掉，可以篡改它5.4 cookie记录上一次访问的时间
3）有的用户，会在浏览器端，禁用cookie
…
设置cookie的生存周期：
res.cookie(“username”,“wc”,{maxAge:600006024*7,httpOnly:true})
除了第1次请求，后面每一次请求，都会带上cookie，在服务器端，就可以
获取cookie， 如何获取cookie?
答： 在express中，你想获取cookie，需要安装一个模块，此模块叫cookie-parser

	安装：npm i cookie-parser
	使用：
		let cookieParser = require("cookie-parser")
		app.use(cookieParser())
		req.cookies // 得到客户端请求时，传递过一过来cookie

2.cookie记录上一次访问的时间

const express = require("express")
const path = require("path")
const cookieParser = require('cookie-parser')
let app = express();
app.use(express.static(path.join(__dirname,'public')))
app.use(cookieParser())
app.get("/",(req,res)=>{
	// 获取cookie 第1次获取不到，值是und
	let last = req.cookies.last;
	// 第1次访问服务器 需要种植一个cookie
	res.cookie("last",new Date().toLocaleString(),{maxAge:60000*60*24*356});
	if(last){
		res.send(`你上一次访问的时间是:${last}`)
	}else{
		// 第1次访问
		res.send(`这是你第1次访问本网站`)
	}
})
app.listen(3000,()=>{
	console.log("server is running 3000~");
})

3.session的基本使用

session的作用：
在一次会话的多次请求之间共享数据，将数据保存到服务器端Session基于Cookie技术实现:

session是服务器端的会话技术
作用: 在一次会话的多次请求之间共享数据
从浏览器第一次向服务器发起请求建立会话, 直到其中一方断开为止会话结束

1. session存储数据在服务器
2. session存储任意类型的数据（Object）
3. session存储大小和数量没有限制（在服务器内存）
4. session存储相对安全

代码如下：

const express = require("express")
const path = require("path")
const cookieParser = require('cookie-parser')
const session = require('express-session')
let app = express();
app.use(express.static(path.join(__dirname,'public')))
// 配置cookie
app.use(cookieParser())
	// 配置session
	app.use(session({
	secret: 'keyboard cat',
	resave: false,
	saveUninitialized: true,5.6 利用session实现登录控制
	// session是基于cookie的
	cookie: { maxAge:60000*10 }
}))
app.get("/",(req,res)=>{
	// session也是存数数据的，你可以把session理解成一片存储数据的区域
	// 你不需要种植cookie，内部会自动帮你种植
	req.session.last = "2021-09-08"; // 当请求/时，给session区域保存一个数据
	// 后面的请求，班长会带着编号来请求，会根据编号找到他对应的session
	console.log("获取班长的session中对应的数据：",req.session.last);
	res.send("hello session")
})
app.listen(3000,()=>{
	console.log("server is running 3000~");
})

4.cookie和session的对比及选择

（1）cookie和session的对比：

（2）cookie和session的选择：

1. cookie将数据保存在浏览器端,数据相对不安全.
   建议敏感的或大量的数据不要放在cookie中，而且数据大小是有限制的
   成本低，对服务器要求不高
2. session将数据保存在服务器端内存,数据相对安全.
   数据的大小要比cookie中数据灵活很多
   成本较高，对服务器压力较大

七、处理请求参数

//1. express会将get的请求参数转换成对象之后, 放到请求对象的query属性中
app.get('/get', (req, res, next)=>{
	console.log(req.query);
});
//2. 告诉express能够解析 application/json类型的请求参数
app.use(express.json());
//3. 告诉express能够解析 表单类型的请求参数application/x-www-form-urlencoded
app.use(express.urlencoded({extended: false}));
// 4.express会将解析之后, 转换成对象的post请求参数放到请求对象的body属性中
app.post('/post', (req, res, next)=>{
console.log(req.body);
});

八、next介绍

1.express-next方法

1.use既可以处理没有路由地址的请求, 也可以处理有路由地址请求
2.use既可以处理get请求, 也可以处理post请求
3.在处理请求的时候是从上至下的判断的, 哪一个先满足就哪一个来处理
4.如果在处理请求的回调函数中没有调用next方法, 那么处理完之后就不会继续往下判断了
5.如果在处理请求的回调函数中调用了next方法,那么处理完之后还会继续往下判断

2. next使用

app.use((req, res, next)=>{
	console.log('use1 没有路由地址');
	next();
});
app.use('/',(req, res, next)=>{
	console.log('use2 有路由地址');
	next();
});
app.get('/api',(req, res, next)=>{
	console.log('get1 /api');
	next();
});
app.get('/api/user',(req, res, next)=>{
	console.log('get2 /api/user');
	next();
});
app.post('/api',(req, res, next)=>{
	console.log('post1 /api');
	next();
});
app.post('/api/user',(req, res, next)=>{
	console.log('post2 /api/user');
	next();
});

3.next方正确使用方式

app.get('/api/user/info',
(req, res, next)=>{
	console.log('验证用户是否登陆');
	next();
},
(req, res, next)=>{
	console.log('用户已经登陆, 可以查看用户信息');
});

九、Express脚手架

1.使用脚手架安装及创建项目

（1）安装脚手架：
npm install express-generator -g
（2）通过脚手架去创建项目：
express myapp
（3）进入myapp中：
cd myapp
（4）跑环境：
npm i
（5）运行项目：
npm start (是npm run start的简写)
默认创建出来的项目，它使用的模板引擎是jade模板引擎

后面创建项目时，生成的项目使用的模板引擎是ejs的，创建项目是指定模板引擎，如下：
命令：express -e myapp2

2.2 使用脚手架生成的app.js文件解析

// 导入了一些第三方的模块
var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
// 导入了处理路由的模块
var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
// 创建了服务端实例对象
var app = express();
// 处理动态网页
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
app.use(logger('dev'));
// 处理post请求参数
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
// 解析cookie
app.use(cookieParser());
// 处理静态网页
app.use(express.static(path.join(__dirname, 'public')));
// 注册处理路由模块
app.use('/', indexRouter);
app.use('/users', usersRouter);
// 处理错误
app.use(function(req, res, next) {
	next(createError(404));
});
// error handler
app.use(function(err, req, res, next) {
	// set locals, only providing error in development
	res.locals.message = err.message;
	res.locals.error = req.app.get('env') === 'development' ? err : {};
	// render the error page
	res.status(err.status || 500);
		res.render('error');
	});
module.exports = app；