Express

express 是基于 Node.js 平台，快速、开放、极简的 Web 开发框架，express 作用和 node.js 内置的 http 模块类似，是用来创建 Web 服务器的，它提供了快速创建 Web 服务器的便捷方法。

基本使用

安装

npm i express

创建基本的 Web 服务器

// 导入express
const express = require("express");
// 创建web服务器
const app = express();
// 通过app.get()方法，监听客户端的get请求
app.get("/", (req, res) => {
  // 通过res.send()方法，可以把处理好的内容，发送给客户端：
  res.send("hello world");
});
// 3. 调用app.listen(port,()=>{}),启动服务器

app.listen(4000, () => {
  console.log("running at 4000");
});

路由

路由表示应用程序端点 (URI) 的定义以及端点响应客户机请求的方式。
路由是由一个 URI、HTTP 请求（GET、POST 等）和若干个句柄组成，它的结构如下： app.METHOD(path, [callback…], callback)， app 是 express 对象的一个实例， METHOD 是一个 HTTP 请求方法， path 是服务器上的路径， callback 是当路由匹配时要执行的函数。
一个基本的路由示例

app.get("/", (req, res) => {
  res.send("hello express");
});

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

// 匹配根路径的请求
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!");
  }
);

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

const cb0 = function (req, res, next) {
  console.log("CB0");
  next();
};

const cb1 = function (req, res, next) {
  console.log("CB1");
  next();
};

const cb2 = function (req, res) {
  res.send("Hello from C!");
};

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

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

const cb0 = function (req, res, next) {
  console.log("CB0");
  next();
};

const 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!");
  }
);

中间件

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

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

中间件的功能包括：

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

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

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

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

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

应用级中间件

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

const app = express();

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

路由级中间件

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

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

错误处理中间件

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

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

内置的中间件

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

app.use(express.static("public"));
app.use(express.static("uploads"));
app.use(express.static("files"));

第三方中间件

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

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

$ npm install cookie-parser

var express = require("express");
var app = express();
var cookieParser = require("cookie-parser");

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

获取请求参数

get

req.query;

post

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

利用 Express 托管静态文件

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

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

app.use(express.static("public"));

现在，public 目录下面的文件就可以访问了。
默认会打开 public 目录下的 index.html 文件

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

模板引擎

SSR：服务端渲染

M+V 发生在服务器端
服务器的压力更大
页面访问的显示速度更快(DOM 操作少)
有利于 SEO 搜索引擎优化
前后端不分离，对后端工程师要求更高，工作量更大
功能比较简单的产品，交互比较简单的产品
对营销推广要求较高的产品(如企业官网)

BSR：客户端渲染

M+V 发生在客户端
客户端压力更大
页面加载速度更慢(DOM 多)
不利于 SEO 优化
前后端分离，便于代码调试和维护，加快开发速度
可以做出更复杂的产品
对营销推广要求不高的产品(如管理系统、后台)

npm i ejs

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

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

返回页面

res.render("login"); //会自动找view文件夹下的login.ejs

ejs 模板

示例

index.js

res.render("login", { title: "hello express" });

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>
        <%=title%>
    </h1>
</body>
</html>

express 更多内容： https://www.expressjs.com.cn/

Q.E.D.

Rido‘s Blog

Rido

Express

express

基本使用

路由

中间件

应用级中间件

路由级中间件

错误处理中间件

内置的中间件

第三方中间件

获取请求参数

利用 Express 托管静态文件

模板引擎

SSR：服务端渲染

BSR：客户端渲染

MongoDB

Axios

Rido

Rido