express的中间件,全局中间件,路由中间件,静态资源中间件以及使用注意事项 , 获取请求体数据

Express 中间件系统 的详细讲解,包括全局中间件、路由中间件、静态资源中间件、请求体解析中间件,以及使用注意事项👇


🌐 一、什么是中间件(Middleware)?

中间件是 函数,在请求到达路由处理器之前被调用,用于拦截、修改请求或响应,或者终止请求处理流程。

中间件函数格式:

js 复制代码
(req, res, next) => { /* your logic */ }

调用 next() 表示继续传递请求给下一个中间件;否则请求会被"卡住"。


📌 二、全局中间件(应用级)

示例 1:日志中间件(所有请求都会执行)

js 复制代码
app.use((req, res, next) => {
  console.log(`[${new Date().toISOString()}] ${req.method} ${req.url}`);
  next(); // 继续执行下一个中间件
});

🚏 三、路由中间件(局部)

只对特定路由生效的中间件:

js 复制代码
const checkAuth = (req, res, next) => {
  if (req.query.token === '123') {
    next();
  } else {
    res.status(401).send('Unauthorized');
  }
};

app.get('/secure', checkAuth, (req, res) => {
  res.send('Access granted!');
});

📁 四、静态资源中间件

内置中间件 express.static() 用于托管静态文件(HTML、CSS、JS、图片等):

js 复制代码
app.use(express.static('public')); // 访问 public 文件夹

// 假设 public 中有 index.html,可以直接通过 http://localhost:3000/index.html 访问

🧾 五、获取请求体数据的中间件

1. 解析 JSON 格式

js 复制代码
app.use(express.json());

2. 解析表单格式(x-www-form-urlencoded)

js 复制代码
app.use(express.urlencoded({ extended: true }));

示例 POST 路由:

js 复制代码
app.post('/login', (req, res) => {
  const { username, password } = req.body;
  res.send(`用户名:${username}, 密码:${password}`);
});

⚠️ 六、使用注意事项

注意事项 说明
中间件顺序 中间件是按顺序执行的,先定义的先执行
next() 必须调用 否则请求会卡住,不继续执行后续中间件或路由
错误处理中间件 中间件中捕获错误时要调用 next(err),Express 会自动进入错误处理中间件
静态中间件要放前面 否则可能被其他中间件或路由拦截
不要滥用全局中间件 建议用局部中间件提高性能与可维护性

🎁 七、完整示例

js 复制代码
const express = require('express');
const app = express();
const port = 3000;

// 中间件
app.use(express.json());
app.use(express.urlencoded({ extended: true }));
app.use(express.static('public'));

// 全局日志中间件
app.use((req, res, next) => {
  console.log(`[LOG] ${req.method} ${req.url}`);
  next();
});

// 路由中间件示例
const auth = (req, res, next) => {
  if (req.query.token === '123') next();
  else res.status(401).send('未授权');
};

app.get('/public-info', (req, res) => res.send('Everyone can see this'));

app.get('/private-info', auth, (req, res) => res.send('This is protected'));

app.post('/form', (req, res) => {
  res.send(req.body);
});

app.listen(port, () => {
  console.log(`App running at http://localhost:${port}`);
});
相关推荐
啦啦91188614 分钟前
【版本更新】Edge 浏览器 v142.0.3595.94 绿色增强版+官方安装包
前端·edge
bing_15817 分钟前
Spring Boot 项目中判断集合(List、Set、Map)不能为空且不为 null的注解使用
spring boot·后端·list
喵个咪20 分钟前
Go 接口与代码复用:替代继承的设计哲学
后端·go
喵个咪22 分钟前
ASIO 定时器完全指南:类型解析、API 用法与实战示例
c++·后端
蚂蚁集团数据体验技术32 分钟前
一个可以补充 Mermaid 的可视化组件库 Infographic
前端·javascript·llm
LQW_home42 分钟前
前端展示 接受springboot Flux数据demo
前端·css·css3
q***d1731 小时前
前端增强现实案例
前端·ar
IT_陈寒1 小时前
Vite 3.0 重磅升级:5个你必须掌握的优化技巧和实战应用
前端·人工智能·后端
JarvanMo1 小时前
Flutter 3.38 + Firebase:2025 年开发者必看的新变化
前端
Lethehong1 小时前
简历优化大师:基于React与AI技术的智能简历优化系统开发实践
前端·人工智能·react.js·kimi k2·蓝耘元生代·蓝耘maas