Express笔记

基于 Node.js 平台，快速、开放、极简的 web 开发框架。

1.特色

• web应用
  Express是一个基于Node.js平台的极简、灵活的Web应用开发框架，它提供一系列强大的特性，帮助你创建各种Web和移动设备应用。
• API
  丰富的HTTP快捷方法和任意排列组合的Connect中间件，让你创建健壮、友好的API变得既快速又简单。
• 性能
  Express不对Node.js已有特性进行二次抽象，只是在它之上扩展了Web所需的基本功能。

2.安装

$ npm install express --save

3.路由

路由是指如何定义应用的端点（URIs）以及如何响应客户端的请求。

路由是由一个 URI、HTTP 请求（GET、POST等）和若干个句柄组成，它的结构如下： app.METHOD(path, [callback…], callback)， app 是 express 对象的一个实例， METHOD 是一个 HTTP 请求方法， path 是服务器上的路径， callback 是当路由匹配时要执行的函数。

下面是一个基本的路由示例：

var express = require('express');
var app = express();

// respond with "hello world" when a GET request is made to the homepage
app.get('/', function(req, res) {
  res.send('hello world');
});

路由路径和请求方法一起定义了请求的端点，它可以是字符串、字符串模式或者正则表达式。

// 匹配根路径的请求
app.get('/', function (req, res) {
  res.send('root');
});

// 匹配 /about 路径的请求
app.get('/about', function (req, res) {
  res.send('about');
});

// 匹配 /random.text 路径的请求
app.get('/random.text', function (req, res) {
  res.send('random.text');
});

使用字符串模式的路由路径示例：

// 匹配 acd 和 abcd
app.get('/ab?cd', function(req, res) {
  res.send('ab?cd');
});

// 匹配 /ab/******
app.get('/ab/:id', function(req, res) {
  res.send('aaaaaaa');
});

// 匹配 abcd、abbcd、abbbcd等
app.get('/ab+cd', function(req, res) {
  res.send('ab+cd');
});

// 匹配 abcd、abxcd、abRABDOMcd、ab123cd等
app.get('/ab*cd', function(req, res) {
  res.send('ab*cd');
});

// 匹配 /abe 和 /abcde
app.get('/ab(cd)?e', function(req, res) {
 res.send('ab(cd)?e');
});

使用正则表达式的路由路径示例：

// 匹配任何路径中含有 a 的路径：
app.get(/a/, function(req, res) {
  res.send('/a/');
});

// 匹配 butterfly、dragonfly，不匹配 butterflyman、dragonfly man等
app.get(/.*fly$/, function(req, res) {
  res.send('/.*fly$/');
});

可以为请求处理提供多个回调函数，其行为类似 中间件。唯一的区别是这些回调函数有可能调用 next(‘route’) 方法而略过其他路由回调函数。可以利用该机制为路由定义前提条件，如果在现有路径上继续执行没有意义，则可将控制权交给剩下的路径。

app.get('/example/a', function (req, res) {
  res.send('Hello from A!');
});

使用多个回调函数处理路由（记得指定 next 对象）：

app.get('/example/b', function (req, res, next) {
  console.log('response will be sent by the next function ...');
  next();
}, function (req, res) {
  res.send('Hello from B!');
});

使用回调函数数组处理路由：

var cb0 = function (req, res, next) {
  console.log('CB0')
  next()
}

var cb1 = function (req, res, next) {
  console.log('CB1')
  next()
}

var cb2 = function (req, res) {
  res.send('Hello from C!')
}

app.get('/example/c', [cb0, cb1, cb2])

混合使用函数和函数数组处理路由：

var cb0 = function (req, res, next) {
  console.log('CB0')
  next()
}

var cb1 = function (req, res, next) {
  console.log('CB1')
  next()
}

app.get('/example/d', [cb0, cb1], function (req, res, next) {
  console.log('response will be sent by the next function ...')
  next()
}, function (req, res) {
  res.send('Hello from D!')
})

4.中间件

Express 是一个自身功能极简，完全是由路由和中间件构成一个的 web 开发框架：从本质上来说，一个 Express 应用就是在调用各种中间件。

中间件（Middleware） 是一个函数，它可以访问请求对象（request object (req)）, 响应对象（response object (res)）, 和 web 应用中处于请求-响应循环流程中的中间件，一般被命名为 next 的变量。

中间件的功能包括：

• 执行任何代码。
• 修改请求和响应对象。
• 终结请求-响应循环。
• 调用堆栈中的下一个中间件。

如果当前中间件没有终结请求-响应循环，则必须调用 next() 方法将控制权交给下一个中间件，否则请求就会挂起。

Express 应用可使用如下几种中间件：

• 应用级中间件
• 路由级中间件
• 错误处理中间件
• 内置中间件
• 第三方中间件

使用可选则挂载路径，可在应用级别或路由级别装载中间件。另外，你还可以同时装在一系列中间件函数，从而在一个挂载点上创建一个子中间件栈。

（1）应用级中间件

应用级中间件绑定到 app 对象 使用 app.use() 和 app.METHOD()， 其中， METHOD 是需要处理的 HTTP 请求的方法，例如 GET, PUT, POST 等等，全部小写。例如：

var app = express()

// 没有挂载路径的中间件，应用的每个请求都会执行该中间件
app.use(function (req, res, next) {
  console.log('Time:', Date.now())
  next()
})

（2）路由级中间件

路由级中间件和应用级中间件一样，只是它绑定的对象为 express.Router()。

var router = express.Router()

var app = express()
var router = express.Router()

// 没有挂载路径的中间件，通过该路由的每个请求都会执行该中间件
router.use(function (req, res, next) {
  console.log('Time:', Date.now())
  next()
})

// 一个中间件栈，显示任何指向 /user/:id 的 HTTP 请求的信息
router.use('/user/:id', function(req, res, next) {
  console.log('Request URL:', req.originalUrl)
  next()
}, function (req, res, next) {
  console.log('Request Type:', req.method)
  next()
})

// 一个中间件栈，处理指向 /user/:id 的 GET 请求
router.get('/user/:id', function (req, res, next) {
  // 如果 user id 为 0, 跳到下一个路由
  if (req.params.id == 0) next('route')
  // 负责将控制权交给栈中下一个中间件
  else next() //
}, function (req, res, next) {
  // 渲染常规页面
  res.render('regular')
})

// 处理 /user/:id， 渲染一个特殊页面
router.get('/user/:id', function (req, res, next) {
  console.log(req.params.id)
  res.render('special')
})

// 将路由挂载至应用
app.use('/', router)

（3）错误处理中间件

错误处理中间件和其他中间件定义类似，只是要使用 4 个参数，而不是 3 个，其签名如下： (err, req, res, next)。

app.use(function(err, req, res, next) {
  console.error(err.stack)
  res.status(500).send('Something broke!')
})

（4）内置的中间件

express.static 是 Express 唯一内置的中间件。它基于 serve-static，负责在 Express 应用中提托管静态资源。每个应用可有多个静态目录。

app.use(express.static('public'))
app.use(express.static('uploads'))
app.use(express.static('files'))

（5）第三方中间件

安装所需功能的 node 模块，并在应用中加载，可以在应用级加载，也可以在路由级加载。

下面的例子安装并加载了一个解析 cookie 的中间件： cookie-parser

$ npm install cookie-parser

var express = require('express')
var app = express()
var cookieParser = require('cookie-parser')

// 加载用于解析 cookie 的中间件
app.use(cookieParser())

5. 获取请求参数

get

req.query

post

app.use(express.urlencoded({extended:false}))
app.use(express.json())
req.body

6.利用 Express 托管静态文件

通过 Express 内置的 express.static 可以方便地托管静态文件，例如图片、CSS、JavaScript 文件等。

将静态资源文件所在的目录作为参数传递给 express.static 中间件就可以提供静态资源文件的访问了。例如，假设在 public 目录放置了图片、CSS 和 JavaScript 文件，你就可以：

app.use(express.static('public'))

现在，public 目录下面的文件就可以访问了。

http://localhost:3000/images/kitten.jpg
http://localhost:3000/css/style.css
http://localhost:3000/js/app.js
http://localhost:3000/images/bg.png
http://localhost:3000/hello.html

所有文件的路径都是相对于存放目录的，因此，存放静态文件的目录名不会出现在 URL 中。

如果你的静态资源存放在多个目录下面，你可以多次调用 express.static 中间件：

app.use(express.static('public'))
app.use(express.static('files'))

访问静态资源文件时，express.static 中间件会根据目录添加的顺序查找所需的文件。

如果你希望所有通过 express.static 访问的文件都存放在一个“虚拟（virtual）”目录（即目录根本不存在）下面，可以通过为静态资源目录指定一个挂载路径的方式来实现，如下所示：

app.use('/static', express.static('public'))

现在，你就可以通过带有 “/static” 前缀的地址来访问 public 目录下面的文件了。

http://localhost:3000/static/images/kitten.jpg
http://localhost:3000/static/css/style.css
http://localhost:3000/static/js/app.js
http://localhost:3000/static/images/bg.png
http://localhost:3000/static/hello.html

7.服务端渲染（模板引擎）

1. 服务器渲染，后端嵌套模板，后端渲染模板，SSR(后端组装页面)
   a. 做好静态页面、动态效果
   b. 把前端代码提供给后端，后端要把静态html以及里面的假数据给删掉，通过模板进行动态生成htm的内容
2. 前后端分离，BSR (前端中组装页面)
   a. 做好静态页面，动态效果。
   b. json模拟，ajax动态创建页面。
   c. 真实接口数据，前后联调。
   d. 把前端提供给后端静态资源文件夹。

npm i ejs

需要在应用中进行如下设置才能让 Express 渲染模板文件：

• views, 放模板文件的目录，比如： app.set(‘views’, ‘./views’)
• view engine, 模板引擎，比如： app.set(‘view engine’, ‘ejs’)

<%  %>   #流程控制标签（if else,for）
<%=  %> #输出标签（原文输出，不解析）
<%-   %> #输出标签 （HTML会被浏览器解析）
<%#  %> #注释，不会发送给前端
<%-  include('/user/show',{user:"abc"})  %> 
#导入公共的模板内容

8. 开发中常用的一些好用的第三方中间件

1. 解析cookie的中间件：cookie-parser

const cookieParser = require('cookie-parser')

app.use(cookieParser(),(req,res,next)=>{
	// 可以在这里得到解析后的cookie
	console.log(req.cookies)
	console.log(req.signedCookies)
});

2. express-session
3. connect-mongo
4. mongoose

const express = require("express");
const session = require("express-session");
const MongoStore = require("connect-mongo");
const app = express();
app.use(
 session({
   secret: "this is session", // 服务器生成 session 的签名
   resave: true, 
   saveUninitialized: true, //强制将为初始化的 session 存储
   cookie: {
     maxAge: 1000 * 60 * 10,// 过期时间
     secure: false, // 为 true 时候表示只有 https 协议才能访问cookie
   },
   rolling: true, //为 true 表示 超时前刷新，cookie 会重新计时； 为 false 表示在超时前刷新多少次，都是按照第一次刷新开始计时。
   store: MongoStore.create({
     mongoUrl: 'mongodb://127.0.0.1:27017/project_session',
     ttl: 1000 * 60 * 10 // 过期时间
   }),
 })
);
app.use((req,res,next)=>{
 if(req.url==="/login"){
   next()
   return;
 }
 if(req.session.user){
     req.session.now= Date();
     next();
 }else{
  	  res.redirect("/login")   
 }
})

6. jsonwebtoken

7. 解析mulitipart/form-data类型的请求 ：multer

const multer = require('multer')
const upload = multer({dest:'uploads/'})//创建存文件的目录

router.post('/api/upload',multer.single('key'),(req,res,next)=>{
	// req.file 是 'key' 文件的信息
	// req.body 将具有文本域数据
})
router.postt('/api/upload',multer.array('key',10),(req,res,next)=>{
	// req.files 是一个对象
	// req.body 将具有文本域数据
})

每个文件具有以下信息

key	description	note
fieldname	Field name 由表单指定
originalname	用户计算机上的文件的名称
encoding	文件编码
mimetype	文件的 MIME 类型
size	文件大小（字节单位）
destination	保存路径	DiskStorage
filename	保存在 destination 中的文件名	DiskStorage
path	已上传文件的完整路径	DiskStorage
buffer	一个存放了整个文件的 Buffer	MemoryStorage

multer(opts)
以下是可以传递给Multer的选项

key	description
dest or storage	在哪里存储文件
fileFilter	文件过滤器，控制哪些文件可以被接受
limits	限制上传的数据
preservePath	保存包含文件名的完整文件路径

8. apidoc