第八章认识Express框架-CSDN博客

阿里云国内75折 回扣 微信号:monov8
阿里云国际,腾讯云国际,低至75折。AWS 93折 免费开户实名账号 代冲值 优惠多多 微信号:monov8 飞机:@monov6

目录

Express模块化路由

基本概述

基本使用

基本构建

案例项目

Express接收请求参数

基本概述

基本类别

Express接收GET请求参数

Express接收POST请求参数

Express接收路由参数


Express模块化路由

基本概述

在Express中路由是指确定应用程序如何响应对特定端点的客户端请求包括获取、添加、更新和删除资源等。

当应用程序收到请求时它通常需要确定如何响应该请求这由路由来完成。在Express应用程序中可以使用模块化路由来更好地组织路由代码并提高其可读性和可维护性。

模块化路由是指将路由器代码分解为多个小文件并将每个文件映射到路由路径。

这样做的好处是可以在应用程序中轻松添加或删除路由路径同时使代码更易于阅读和维护。使用Express的Router函数可以轻松地将路由器添加到应用程序中使其成为模块化的路由器。

每个Express路由器是一个中间件它可以在其中定义一个或多个路由。

路由有一个HTTP方法如get、post、put、delete等以及一个指定路由路径的路径。

当路由被触发时将执行一个或多个处理程序函数这些函数将确定如何响应请求。可以使用app.use()方法将路由器添加到应用程序中。这样当收到请求时Express将自动将请求路由到正确的路由器中。

基本使用

实现模块化路由需要用到express.Router()方法来创建一个新的路由器对象(route)然后使用route.get()和route.post()来注册当前模块路由对象下的二级路由形成一个简单的模块化路由。

  • express.Router()方法定义route对象的示例代码如下
const route = express.Router();
//express.Router()表示创建模块化路由对象

提示这行代码使用 express.Router() 方法创建了一个新的路由对象 route 该对象可以用来注册该模块下的路由处理函数即该模块下的所有路由都会在 route 对象上定义以实现模块化的路由设计。

使用 express.Router() 方法创建一个新的路由对象可以避免使用全局的 app 对象来定义路由提高代码的可读性也更容易维护。

这段代码中的 const 是用来声明常量的关键字而 route 则是该常量的名称。

  • route对象可以定义二级路由示例代码如下
route.get('请求路径','请求处理函数');
route.post('请求路径','请求处理函数');

这两行代码使用 route.get() 和 route.post() 方法来注册当前模块路由对象下的二级路由具体来说

  • route.get('请求路径', '请求处理函数') 方法用于在 route 路由对象上定义 GET 请求的路由其中 '请求路径' 指定路由路径 '请求处理函数' 指定该路由的处理函数。
  • route.post('请求路径', '请求处理函数') 方法用于在 route 路由对象上定义 POST 请求的路由其中 '请求路径' 指定路由路径 '请求处理函数' 指定该路由的处理函数。

通过这两个方法可以在当前模块下定义所需的所有路由即可实现模块化的路由设计。

  • route对象创建成功后使用app.use()注册route模块化路由示例如下
app.use('请求路径',route);

这行代码使用了 app.use() 方法将定义好的 route 路由对象注册到了 Express 应用中并制定了该路由对象的请求路径。

具体来说app.use('请求路径', route) 的含义为

  • 请求路径指定了路由所监听的路径即当客户端发起该路径的请求时会触发该路由对象中的相应路由处理函数。
  • route指定了该路由对象即之前定义的 express.Router() 创建的路由对象。

这行代码的作用是将路由对象注册到应用中使得应用可以通过该路由对象来处理对应的二级路由请求。

综上所诉模块化路由的基本使用的步骤如下

  1. 创建一个模块化的路由对象
    const express = require('express');
    const router = express.Router();
    
  2. 为路由对象添加一个或多个路由
    router.get('/', function(req, res) {
      res.send('Hello World!');
    });
    router.get('/user/:id', function(req, res) {
      res.send('user ' + req.params.id);
    });
    
  3. 把路由对象挂载到应用程序中的指定路径
    app.use('/api', router);
    
    这个例子中我们把路由对象挂载到 /api 的路径下因此访问 /api/api/user/:id 时都会使用我们刚刚定义的路由规则。

完整的示例代码如下

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

// 创建一个模块化的路由对象
const router = express.Router();

// 为路由对象添加一个或多个路由
router.get('/', function(req, res) {
  res.send('Hello World!');
});
router.get('/user/:id', function(req, res) {
  res.send('user ' + req.params.id);
});

// 把路由对象挂载到应用程序中的指定路径
app.use('/api', router);

// 启动应用程序
app.listen(3000, function() {
  console.log('App is listening on port 3000!');
});

这样当我们访问 http://localhost:3000/api 时会显示 Hello World!访问 http://localhost:3000/api/user/123 时会显示 user 123

代码注释

  1. const express = require('express'); 导入 express 模块。

  2. const app = express(); 创建一个 Express 应用程序实例。

  3. const router = express.Router(); 创建一个模块化的路由对象。

  4. router.get('/', function(req, res) {...} 为路由对象添加一个 GET 请求处理函数当用户访问路径为 / 时返回 Hello World!

  5. router.get('/user/:id', function(req, res) {...} 为路由对象添加另一个 GET 请求处理函数当用户访问路径为 /user/:id 时返回 user :id:id 是一个动态参数表示用户 ID。

  6. app.use('/api', router); 把路由对象挂载到应用程序中的 /api 路径下即当用户访问应用程序的 /api 路径时使用该路由对象进行处理。

  7. app.listen(3000, function() {...} 启动应用程序监听端口 3000并在控制台输出 "App is listening on port 3000!"

 

基本构建

这个是为了更加直观的了解构建模块化路由的过程

  1. 创建一个模块化的路由对象

在 Express 应用程序中可以使用 express.Router() 方法创建一个模块化的路由对象。这个方法返回一个路由对象该对象表示一个完整的路由模块可以在此对象中添加特定的 HTTP 请求方式和 URL 路径然后在应用程序中使用该路由模块。

const express = require('express');
const router = express.Router();
  1. 定义路由规则

在路由对象上定义路由规则可以使用各种 HTTP 请求方式例如 get()post()put()delete() 等和 URL 路径。下面以 get() 方法为例说明

router.get('/', (req, res) => {
  res.send('Hello World!');
});

该代码定义了一个 GET 请求方式的路由规则当客户端向 URL 路径 / 发送请求时会执行该处理程序并返回字符串 'Hello World!'

  1. 把路由对象导出

在路由模块中调用 module.exports 方法将路由对象作为模块输出该对象可以在应用程序中使用。例如

module.exports = router;
  1. 在应用程序中使用路由模块

导入路由模块在应用程序中使用 app.use() 方法挂载该模块。例如

const router = require('./router');
app.use('/api', router);

此代码将路由模块 router 挂载到应用程序的 /api 路径上当客户端向 /api 路径发送请求时会执行该模块中定义的路由规则。

完整的模块化路由示例代码

新建文件router.js

const express = require('express');
const router = express.Router();

router.get('/', (req, res) => {
  res.send('Hello World!');
});

router.get('/users', (req, res) => {
  res.send('Users page');
});

module.exports = router;

新建文件app.js

const express = require('express');
const app = express();
const router = require('./router');

app.use('/api', router);

app.listen(3000, () => {
  console.log('Server started on port 3000');
});

注意以上代码一般是在Express安装的目录下新建文件进行。

在此示例中当客户端向 /api 路径发送 GET 请求时会匹配到 router 中定义的第一个路由规则并返回 'Hello World!'。当客户端向 /api/users 路径发送 GET 请求时会匹配到 router 中定义的第二个路由规则并返回 'Users page'

案例项目

一个简单的项目实现一个用户注册和登录系统。首先我们需要安装和引入Express模块

  1. 安装Express模块
npm install express --save
  1. 引入Express模块
const express = require('express');
const app = express();

接下来我们可以定义一些路由和处理函数来实现注册和登录功能。

  1. 注册页面路由和处理函数
// 注册页面路由
app.get('/register', (req, res) => {
  res.send('注册页面');
});

// 注册处理函数
app.post('/register', (req, res) => {
  // 处理注册请求
});

在上面的代码中我们定义了一个GET请求的/register路由和一个POST请求的/register路由。GET请求的/register路由用于显示注册页面POST请求的/register路由用于处理注册请求。

  1. 登录页面路由和处理函数
// 登录页面路由
app.get('/login', (req, res) => {
  res.send('登录页面');
});

// 登录处理函数
app.post('/login', (req, res) => {
  // 处理登录请求
});

同样的我们定义了一个GET请求的/login路由和一个POST请求的/login路由。GET请求的/login路由用于显示登录页面POST请求的/login路由用于处理登录请求。

最后我们需要监听端口并启动服务器。

  1. 启动服务器
app.listen(3000, () => {
  console.log('服务器已启动');
});

完整代码如下

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

// 注册页面路由
app.get('/register', (req, res) => {
  res.send('注册页面');
});

// 注册处理函数
app.post('/register', (req, res) => {
  // 处理注册请求
});

// 登录页面路由
app.get('/login', (req, res) => {
  res.send('登录页面');
});

// 登录处理函数
app.post('/login', (req, res) => {
  // 处理登录请求
});

// 启动服务器
app.listen(3000, () => {
  console.log('服务器已启动');
});

这是一个简单的用户注册和登录系统只实现了页面和路由并没有实现具体的处理逻辑。在实际项目中我们需要根据业务需求实现具体的功能。

可以通过浏览器或者curl命令访问

  1. 使用浏览器访问

在浏览器地址栏输入http://localhost:3000/register或者http://localhost:3000/login来访问注册页面和登录页面。

  1. 使用curl命令访问

打开终端或命令行输入以下命令

curl http://localhost:3000/register

或者

curl http://localhost:3000/login

执行后会输出页面内容。

 

Express接收请求参数

基本概述

Express是一款非常流行的Node.js Web框架使用它能使我们轻松构建Web应用程序。在Web应用程序中我们需要接收来自客户端发送的请求数据这个过程中请求参数起着至关重要的作用。因此使用Express接收请求参数是非常必要的原因如下

  1. 灵活性当我们接收到请求参数后可以根据参数的不同来执行不同的逻辑代码或者返回不同的输出结果从而使我们的程序更加灵活。

  2. 安全性对于不合法的请求参数我们可以进行校验和过滤避免一些安全问题的发生提高我们程序的安全性。

  3. 交互性通过接收请求参数我们可以使程序更与用户进行交互例如接收用户的表单提交数据登录验证等等。

  4. 数据处理接收到请求参数后我们可以对请求的数据进行处理例如入库修改等等。

总之Express是一款非常灵活、快速、扩展性强的Web框架使用它接收请求参数可以使我们的Web应用程序更加高效、可靠和安全。

基本类别

Express接收GET请求参数

Express框架中的req.query用于获取GET请求参数框架内部会将GET参数转换为对象并返回。示例如下

app.get('/'(req,res) => {
  res.send(req.query);
});

这段代码中有一行写成了两行让我们逐行来看

app.get('/', (req, res) => {

这一行表示使用 Express 应用程序对象 appget 方法表示当应用程序接收到来自根路径 / 的 GET 请求时会执行后续的回调函数。回调函数接收两个参数 reqres分别代表请求对象和响应对象。

  res.send(req.query);

这一行使用 res.send 方法将 req.query 返回给客户端作为响应的内容。req.query 是一个对象包含了发送到服务器的查询参数。当客户端发送 GET 请求时Express 框架会将查询参数解析为一个对象并将其作为 req.query 属性存储在请求对象中。因此使用 res.send(req.query) 将查询参数作为响应返回给客户端。

 

案例来演示如何使用Express接收GET请求参数。

首先需要安装Express框架

npm install express --save

接下来我们创建一个index.js文件并引入Express框架

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

然后我们创建一个GET路由用来接收参数

app.get('/api/user', (req, res) => {
  const { name, age } = req.query;
  res.send(`Hello ${name}, you are ${age} years old!`);
});

以上代码中我们在/api/user路径下创建了一个GET路由当用户访问该路径时框架会自动解析URL中的参数并将其转换为一个对象对象的属性名即为参数名属性值即为参数值。

最后我们添加一个监听端口的代码启动应用

const port = 3000;
app.listen(port, () => {
  console.log(`Server running at http://localhost:${port}`);
});

完整代码如下

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

app.get('/api/user', (req, res) => {
  const { name, age } = req.query;
  res.send(`Hello ${name}, you are ${age} years old!`);
});

const port = 3000;
app.listen(port, () => {
  console.log(`Server running at http://localhost:${port}`);
});

现在你可以通过访问http://localhost:3000/api/user?name=Tom&age=18来测试应用程序是否正常工作了。结果如下图

00557b1182f04fa89f5fe1cd3aec3a5e.png

Express接收POST请求参数

Express框架中的req.body用于获取POST请求参数需要借助第三方body-parser模块将POST参数转换为对象形式。语法跟上述代码相同只需要在res.send()输入rep.body即可

在 Express 中要获取 POST 请求中的参数需要使用 req.body 对象。但是因为 Node.js 的核心模块 http 并没有提供直接获取 POST 参数的方法所以我们需要使用第三方中间件来实现这个功能。其中body-parser 库是最常用的一种。

在使用 body-parser 库之前需要使用 npm 命令将该库安装到项目中。可以通过在命令行中执行以下命令来安装

npm install body-parser

安装好之后在 Express 应用程序中引入该库并将其添加为中间件即可。以下是一个简单的例子假设我们有一张表单其中有一个 name 输入框和一个 password 输入框。当我们提交表单并发送 POST 请求时我们需要从 req.body 对象中获取这些输入框的值

const express = require('express');
const bodyParser = require('body-parser');
const app = express();

// 添加 body-parser 中间件
app.use(bodyParser.urlencoded({ extended: true }));

app.post('/login', (req, res) => {
  const name = req.body.name;
  const password = req.body.password;
  // use name and password variables to authenticate user
});

在上面的例子中app.use 函数用于加载 body-parser 中间件并将其设置为处理 URL 编码的请求体。此时req.body 对象已经包含了表单提交的参数。注意body-parser 库会将 POST 请求的参数转换为对象形式因此可以用 req.body.namereq.body.password 语法获取表单中的值。

案例来演示如何使用Express接收POST请求参数。

首先需要安装Express框架和body-parser模块

npm install express body-parser --save

接下来我们创建一个index.js文件并引入Express框架和body-parser模块

const express = require('express');
const bodyParser = require('body-parser');
const app = express();

然后我们需要在应用程序中使用body-parser中间件来处理POST请求中的参数

app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

以上代码中我们使用body-parser中间件来处理两种类型的POST请求参数application/x-www-form-urlencodedapplication/json。其中urlencoded表示把参数转换为URL字符串的形式json表示把参数转换为JSON对象的形式。

接下来我们创建一个POST路由来接收参数

app.post('/api/user', (req, res) => {
  const { name, age } = req.body;
  res.send(`Hello ${name}, you are ${age} years old!`);
});

以上代码中我们在/api/user路径下创建了一个POST路由当用户发起POST请求时框架会自动解析请求体中的参数并将其转换为一个对象对象的属性名即为参数名属性值即为参数值。

最后我们添加一个监听端口的代码启动应用

const port = 3000;
app.listen(port, () => {
  console.log(`Server running at http://localhost:${port}`);
});

完整代码如下

const express = require('express');
const bodyParser = require('body-parser');
const app = express();

app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

app.post('/api/user', (req, res) => {
  const { name, age } = req.body;
  res.send(`Hello ${name}, you are ${age} years old!`);
});

const port = 3000;
app.listen(port, () => {
  console.log(`Server running at http://localhost:${port}`);
});

现在你可以使用POSTMAN等工具来发送POST请求格式为application/x-www-form-urlencodedapplication/json参数为nameage来测试应用程序是否正常工作了。

Express接收路由参数

在使用 Express 构建 Web 应用时我们经常需要从客户端接收一些信息。其中一种方式是在 URL 中传递参数这种参数通常称为路由参数或路径参数。在 Express 中可以使用冒号 : 来定义路由参数。

Express接收路由参数的示例代码

app.get('/find/:id', (reg,res) => {
res.send(req.params);
});

这段代码定义了一个 GET 请求的路由 /find/:id其中 :id 是一个路由参数。当客户端请求 /find/123 时Express 会将 123 解析为 req.params.id并将一个对象 { id: '123' } 发送给客户端作为响应。

代码中的 req.params 是一个对象它包含了所有的路由参数和它们的值。在本例中它的值为 { id: '123' }。通过将整个对象发送回客户端我们可以将所有的路由参数都包含在响应中以便客户端可以根据需要进行处理。

案例以下是一个简单的 Express 项目它演示了如何接收和使用路由参数

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

// 定义一个路由处理程序它匹配 '/students/:id' 路由
app.get('/students/:id', (req, res) => {
  const { id } = req.params;
  // 假设这里根据 id 从数据库中获取学生信息
  const student = { id, name: 'John Doe', age: 20 };
  res.send(student);
});

app.listen(3000, () => {
  console.log('Server started on port 3000');
});

在上面的示例中我们定义了一个路由处理程序它匹配 /students/:id 路由其中 :id 是路由参数。当客户端请求该路由时我们从 req.params 中提取 id 参数并使用它从数据库中获取学生信息。然后我们将学生信息发送回客户端。

例如如果客户端请求路径为 /students/123则路由处理程序会响应

{
  "id": "123",
  "name": "John Doe",
  "age": 20
}

当然这只是一个简单的示例实际上你可能需要更复杂的路由参数来访问数据库中的数据。

注意可以使用类似`http://localhost:3000/students/123`的URL来访问此路由处理程序。其中`123`是路由参数可以是任何数字。此示例假设您已经启动了该应用程序并在端口3000上侦听连接。如果要在浏览器中进行测试只需将上面的URL复制到浏览器地址栏中即可。

文章到此一游修行结束打卡

 

阿里云国内75折 回扣 微信号:monov8
阿里云国际,腾讯云国际,低至75折。AWS 93折 免费开户实名账号 代冲值 优惠多多 微信号:monov8 飞机:@monov6