Express.js 简介

Express.js 是基于 Node.js 的快速、无偏见、极简的 Web 框架,它提供了一套强大的特性,使构建 Web 应用和 API 变得更加简单和快速。

核心特点

  • 轻量级:Express.js 是一个极简的框架,只提供了基本的 Web 应用功能,没有过多的内置功能,让开发者可以根据需要自由扩展。
  • 灵活:Express.js 没有强制的项目结构或设计模式,开发者可以根据自己的需求和偏好来组织代码。
  • 可扩展:通过中间件机制,Express.js 可以轻松扩展功能,满足不同应用的需求。
  • 生态系统丰富:Express.js 拥有庞大的生态系统,有大量的第三方中间件和工具可供选择。

安装与配置

安装 Express.js

要使用 Express.js,首先需要安装 Node.js 和 npm,然后通过 npm 安装 Express.js:

# 初始化项目
npm init -y

# 安装 Express.js
npm install express

创建第一个 Express.js 应用

创建一个简单的 Express.js 应用,响应 HTTP 请求:

// app.js
const express = require('express');
const app = express();
const port = 3000;

// 路由处理
app.get('/', (req, res) => {
  res.send('Hello Express!');
});

// 启动服务器
app.listen(port, () => {
  console.log(`Server running at http://localhost:${port}`);
});

运行应用:

node app.js

路由系统

Express.js 的路由系统允许开发者定义不同 HTTP 请求方法和 URL 路径的处理函数。

基本路由

// GET 请求
app.get('/users', (req, res) => {
  res.send('获取用户列表');
});

// POST 请求
app.post('/users', (req, res) => {
  res.send('创建新用户');
});

// PUT 请求
app.put('/users/:id', (req, res) => {
  res.send(`更新用户 ${req.params.id}`);
});

// DELETE 请求
app.delete('/users/:id', (req, res) => {
  res.send(`删除用户 ${req.params.id}`);
});

路由参数

Express.js 支持在路由路径中定义参数,通过 req.params 获取:

app.get('/users/:id', (req, res) => {
  const userId = req.params.id;
  res.send(`用户 ID: ${userId}`);
});

查询参数

通过 req.query 获取 URL 查询参数:

app.get('/users', (req, res) => {
  const page = req.query.page || 1;
  const limit = req.query.limit || 10;
  res.send(`分页查询: 第 ${page} 页,每页 ${limit} 条`);
});

中间件

中间件是 Express.js 的核心概念,它是一个函数,能够访问请求对象 (req)、响应对象 (res) 和应用的请求-响应循环中的下一个中间件函数 (next)。

内置中间件

Express.js 内置了一些常用的中间件:

// 静态文件服务
app.use(express.static('public'));

// 解析 JSON 请求体
app.use(express.json());

// 解析 URL 编码的请求体
app.use(express.urlencoded({ extended: true }));

自定义中间件

开发者可以创建自定义中间件来处理特定的逻辑:

// 日志中间件
const logger = (req, res, next) => {
  console.log(`${new Date().toISOString()} - ${req.method} ${req.url}`);
  next();
};

// 使用中间件
app.use(logger);

错误处理中间件

错误处理中间件用于捕获和处理应用中的错误:

// 错误处理中间件
app.use((err, req, res, next) => {
  console.error(err.stack);
  res.status(500).send('Internal Server Error');
});

模板引擎

Express.js 支持多种模板引擎,如 EJS、Pug、Handlebars 等,用于渲染动态 HTML 页面。

安装和配置 EJS

# 安装 EJS
npm install ejs
// 配置模板引擎
app.set('view engine', 'ejs');
app.set('views', './views');

// 使用模板引擎
app.get('/', (req, res) => {
  res.render('index', { title: 'Express.js 教程', message: 'Hello Express!' });
});

创建模板文件

创建 views/index.ejs 文件:

<!DOCTYPE html>
<html>
<head>
  <title><%= title %></title>
</head>
<body>
  <h1><%= message %></h1>
</body>
</html>

实用案例分析

构建 RESTful API

下面是一个使用 Express.js 构建 RESTful API 的示例:

项目结构

├── app.js
├── routes/
│   └── users.js
├── controllers/
│   └── userController.js
├── models/
│   └── userModel.js
└── package.json

代码实现

  1. 模型定义 (models/userModel.js):
// 模拟用户数据
let users = [
  { id: 1, name: '张三', email: 'zhangsan@example.com' },
  { id: 2, name: '李四', email: 'lisi@example.com' }
];

// 获取所有用户
const getUsers = () => users;

// 根据 ID 获取用户
const getUserById = (id) => users.find(user => user.id === parseInt(id));

// 创建新用户
const createUser = (user) => {
  const newUser = {
    id: users.length + 1,
    ...user
  };
  users.push(newUser);
  return newUser;
};

// 更新用户
const updateUser = (id, user) => {
  const index = users.findIndex(user => user.id === parseInt(id));
  if (index === -1) return null;
  users[index] = { ...users[index], ...user };
  return users[index];
};

// 删除用户
const deleteUser = (id) => {
  const index = users.findIndex(user => user.id === parseInt(id));
  if (index === -1) return null;
  const deletedUser = users[index];
  users.splice(index, 1);
  return deletedUser;
};

module.exports = {
  getUsers,
  getUserById,
  createUser,
  updateUser,
  deleteUser
};
  1. 控制器 (controllers/userController.js):
const userModel = require('../models/userModel');

// 获取所有用户
const getUsers = (req, res) => {
  const users = userModel.getUsers();
  res.json(users);
};

// 获取单个用户
const getUserById = (req, res) => {
  const user = userModel.getUserById(req.params.id);
  if (!user) {
    res.status(404).json({ message: 'User not found' });
    return;
  }
  res.json(user);
};

// 创建用户
const createUser = (req, res) => {
  const newUser = userModel.createUser(req.body);
  res.status(201).json(newUser);
};

// 更新用户
const updateUser = (req, res) => {
  const updatedUser = userModel.updateUser(req.params.id, req.body);
  if (!updatedUser) {
    res.status(404).json({ message: 'User not found' });
    return;
  }
  res.json(updatedUser);
};

// 删除用户
const deleteUser = (req, res) => {
  const deletedUser = userModel.deleteUser(req.params.id);
  if (!deletedUser) {
    res.status(404).json({ message: 'User not found' });
    return;
  }
  res.json({ message: 'User deleted successfully' });
};

module.exports = {
  getUsers,
  getUserById,
  createUser,
  updateUser,
  deleteUser
};
  1. 路由 (routes/users.js):
const express = require('express');
const router = express.Router();
const userController = require('../controllers/userController');

// 路由定义
router.get('/', userController.getUsers);
router.get('/:id', userController.getUserById);
router.post('/', userController.createUser);
router.put('/:id', userController.updateUser);
router.delete('/:id', userController.deleteUser);

module.exports = router;
  1. 主应用 (app.js):
const express = require('express');
const app = express();
const port = 3000;
const usersRouter = require('./routes/users');

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

// 路由
app.use('/api/users', usersRouter);

// 错误处理
app.use((err, req, res, next) => {
  console.error(err.stack);
  res.status(500).json({ message: 'Internal Server Error' });
});

// 启动服务器
app.listen(port, () => {
  console.log(`Server running at http://localhost:${port}`);
});

测试 API

使用 curl 或 Postman 测试 API:

# 获取所有用户
curl http://localhost:3000/api/users

# 获取单个用户
curl http://localhost:3000/api/users/1

# 创建用户
curl -X POST http://localhost:3000/api/users -H "Content-Type: application/json" -d '{"name": "王五", "email": "wangwu@example.com"}'

# 更新用户
curl -X PUT http://localhost:3000/api/users/1 -H "Content-Type: application/json" -d '{"name": "张三更新", "email": "zhangsan-updated@example.com"}'

# 删除用户
curl -X DELETE http://localhost:3000/api/users/1

总结

Express.js 是一个轻量级、灵活、可扩展的 Web 框架,它为构建 Web 应用和 API 提供了强大的基础。通过本教程,你应该已经了解了 Express.js 的核心概念和基本用法,包括路由系统、中间件、模板引擎等。

Express.js 的极简设计理念使其成为 Node.js 生态系统中最流行的 Web 框架之一,它适用于构建各种类型的 Web 应用,从简单的静态网站到复杂的企业级 API。

要深入学习 Express.js,建议查阅 官方文档 和实践更多的项目案例,以掌握其高级特性和最佳实践。

« 上一篇 Redux Toolkit 教程 - Redux 的官方工具集 下一篇 » NestJS 教程