Web 开发框架 — Express 精讲(安装使用、静态托管、路由处理、中间件的使用)(2)

本文涉及的产品
Serverless 应用引擎 SAE,800核*时 1600GiB*时
云原生网关 MSE Higress,422元/月
注册配置 MSE Nacos/ZooKeeper,118元/月
简介: Web 开发框架 — Express 精讲(安装使用、静态托管、路由处理、中间件的使用)(2)

五、Express 中间件

       中间件是一个函数,它可以访问请求对象(request objeck(req))、响应对象(response object(res)) ,和 Web 应用中处于请求 · 响应循环流程中的中间件;


       中间件还有第三个参数 next,用于将此请求传递到下一环节;从本质上来说,一个 Express 应用就是在调用各种中间件。中间件分为以下几种:


应用级中间件(app.use)

路由级中间件(app.get/post...)

错误处理中间件

内置中间件(如我们之前使用的静态资源托管 static 就是内置中间件)

第三方中间件

1. 应用级中间件

       应用级中间件绑定到 app对象 使用 app.use() 和 app.METHOD();


       新建 1.js 文件进行演示,通过三个中间件来实现访问 /user 路径,记录访问时间、访问日志以及访问次数。


// study_Express/1.js
const express = require('express') //require函数引入express包
const app = express() //调用函数
let total = 0; //访问量
//应用级中间件
app.use('/user', (req, res, next) => { //第一个中间件
  console.log('访问时间:' + Date.now()) //记录访问时间
  next() //进入下一个中间件,不使用next则不会执行下面的中间件
})
app.use('/user', (req, res, next) => { //第二个中间件
  console.log('日志:×××访问了/user') //记录访问日志
  next()
})
app.use('/user', (req, res) => { //第三个中间件
  total++; //访问次数增加
  console.log('当前访问量:' + total)
  res.send('返回结果')
})
app.listen(3000, () => { //创建监听
  console.log('中间件服务器启动成功...')
})

启动服务后访问 /user 路径;

image.png



此时后台会打印出相关信息,每刷新一次,次数加一;

image.png



2. 路由级中间件

       新建文件 2.js 进行演示,使用两个中间件打印出1、2。


// study_Express/2.js
const express = require('express') //require函数引入express包
const app = express() //调用函数
//路由级中间件
app.get('/luyou', (req, res, next) => {
  console.log(1)
  next()
})
app.get('/luyou', (req, res) => {
  console.log(2)
})
app.listen(3000, () => { //创建监听
  console.log('路由级中间件服务器启动成功...')
})

启动服务后访问 /luyou 路径;

image.png



后台打印出结果;

image.png



此外,路由级中间件中调用 next 时,可以加一个 route 参数 next('route'),意为跳转至下一个路由;


注意区分:


       next();跳转至下一个中间件。


       next('route');跳转至下一个路由,所谓下一个路由就是通过 get、post  或者其他方式所绑定的路由。


如下面这种写法:


const express = require('express') //require函数引入express包
const app = express() //调用函数
//路由级中间件
app.get('/luyou', (req, res, next) => { //第一个中间件 第一个路由
  console.log(1)
  next('route') //跳转至下一个路由
}, (req, res) => { //第二个中间件
  console.log(2)
})
app.get('/luyou', (req, res) => { //第三个中间件 第二个路由
  console.log(3);
  res.send('路由级中间件返回结果')
})
app.listen(3000, () => { //创建监听
  console.log('路由级中间件服务器启动成功...')
})

第一个中间件和第二个中间件进行了嵌套,只使用了一个路由,在第一个中间件中使用了 next('route'); 直接跳到了下一路由,所以第二个中间件的结果 2 就不会打印了,如下:


image.png




3. 错误处理中间件

       错误处理中间件需要4个参数,必须提供四个参数以将其标识为错误处理中间件函数。即使不需要使用 next 对象,也必须指定它。否则,该 next 对象将被解释为常规中间件并且无法处理错误。格式如下:


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

4. 第三方中间件 —— body-parser

       第三方中间件有很多,在这里我们重点演示参数传递 body-parser,其余第三方中间件用法相同;

image.png



首先 npm 安装 body-parser,终端中中使用命令 npm install body-parser --save;

image.png



安装成功后会在 package.json 文件中显示;

image.png



新建文件 3.js 进行演示,实现简易的登录表单验证功能;


// study_Express/3.js
const express = require('express') //require函数引入express包
const app = express() //调用函数
const bodyParser = require('body-parser') //引入body-parser
//挂载(启用)内置中间件static,托管静态资源
app.use(express.static('public'))
//挂载参数处理中间件(此处解析post表单提交的数据)
app.use(bodyParser.urlencoded({
  extended: false
}))
//处理get提交的数据
// app.get('/login', (req, res) => {
//   let data = req.query;
//   console.log(data);
//   res.send('get提交时的数据')
// })
//处理post提交的数据
app.post('/login', (req, res) => {
  let data = req.body;
  if (data.username == '前端小马' && data.password == '123456') {
    res.send('登录成功!')
  } else {
    res.send('用户名或密码错误!')
  }
})
app.listen(3000, () => {
  console.log('第三方中间件服务启动...')
})

为了展示效果,我们在目录 public 下新建一个 html 文件来制作表单,并托管它;

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>表单</title>
  <style></style>
</head>
<body>
  <form action="http://localhost:3000/login" method="post">
    用户:<input type="text" name="username"><br>
    密码:<input type="password" name="password"><br>
    <input type="submit" value="提交">
  </form>
</body>
</html>

启动服务后访问 /login.html,可以正常验证:

image.png

相关文章
|
5天前
|
开发框架 JSON API
震撼发布!Python Web开发框架下的RESTful API设计全攻略,让数据交互更自由!
【7月更文挑战第22天】在Python Web开发中,设计高效的RESTful API涉及选择框架(如Flask或Django)、明确资源及使用HTTP方法(GET, POST, PUT, DELETE)来操作数据。响应格式通常是JSON,错误处理也很重要。示例展示了使用Flask创建图书管理API,包括版本控制、文档化、安全性和性能优化是最佳实践。这样的API使数据交互更顺畅。
26 2
|
3天前
|
JSON API 网络架构
揭秘!Python Web框架下的RESTful API设计,为何成为互联网新宠?
【7月更文挑战第24天】在互联网快速发展背景下,RESTful API以其简洁性和可扩展性成为应用间通信的首选。REST强调资源为核心,利用HTTP方法处理CRUD操作,促进前后端分离,提高开发效率。Python的Flask框架支持轻松构建RESTful API,通过路由、请求和响应机制实现。示例代码展示了如何使用Flask创建、读取和更新用户信息。Python Web框架因其丰富的工具和库,简化RESTful API开发,适应微服务架构需求,在互联网发展中扮演重要角色。
|
6天前
|
移动开发 小程序 JavaScript
转Web运行时的“框架”模块主要负责什么功能
转Web运行时的“框架”模块主要负责什么功能
|
8天前
|
JSON 中间件 数据处理
实践出真知:通过项目学习Python Web框架的路由与中间件设计
【7月更文挑战第19天】探索Python Web开发,掌握Flask或Django的关键在于理解路由和中间件。路由连接URL与功能,如Flask中@app.route()定义请求响应路径。中间件在请求处理前后执行,提供扩展功能,如日志、认证。通过实践项目,不仅学习理论,还能提升构建高效Web应用的能力。示例代码展示路由定义及模拟中间件行为,强调动手实践的重要性。
|
8天前
|
JSON 中间件 Go
Go语言Web框架Gin介绍
【7月更文挑战第19天】Gin是一个功能强大、高性能且易于使用的Go语言Web框架。它提供了路由、中间件、参数绑定等丰富的功能,帮助开发者快速构建高质量的Web应用。通过本文的介绍,你应该对Gin框架有了初步的了解,并能够使用它来开发简单的Web服务。随着你对Gin的深入学习和实践,你将能够利用它构建更复杂、更强大的Web应用。
|
6天前
|
API 网络架构 开发者
探索Python Web框架的核心:路由机制详解
【7月更文挑战第21天】Python Web开发中,Flask和Django的路由机制解析:Flask用@app.route装饰器绑定URL到视图,如`@app.route(&#39;/user/&lt;username&gt;&#39;)`;Django通过urls.py配置URL模式,如`path(&#39;user/&lt;str:username&gt;/&#39;, views.user_profile, name=&#39;user_profile&#39;)`。两者都支持静态、动态路由和HTTP方法绑定,展现路由灵活性,助力构建高效Web应用。
15 0
|
6天前
|
缓存 监控 安全
中间件在Python Web框架中的角色与应用场景
【7月更文挑战第21天】中间件在Python Web开发中作为服务器与应用间的软件层,拦截、处理请求和响应,无需改动应用代码。它扩展框架功能,复用跨应用逻辑,加强安全,优化性能。如Django中间件处理请求/响应,Flask通过WSGI中间件实现类似功能,两者均在不触及核心代码前提下,灵活增强应用行为,是现代Web开发关键组件。
|
7天前
|
前端开发 开发者 Python
从零到一:Python Web框架中的模板引擎入门与进阶
【7月更文挑战第20天】模板引擎如Jinja2在Python Web开发中连接后端与前端,提高代码可读性和协作效率。Flask默认集成Jinja2,提供条件语句、循环、宏和模板继承等功能。例如,创建一个简单Flask应用,渲染&quot;Hello, World!&quot;,并展示如何使用条件语句和循环处理数据。通过宏定义重用代码,模板继承实现页面结构共享。学习模板引擎能提升开发效率和项目质量。
18 0
|
7天前
|
缓存 中间件 网络架构
Python Web开发实战:高效利用路由与中间件提升应用性能
【7月更文挑战第20天】在Python Web开发中,路由与中间件是构建高效应用的核心。路由通过装饰器如`@app.route()`在Flask中映射请求至处理函数;中间件(如`@app.before_request`, `@app.after_request`)则在请求流程中插入自定义逻辑。优化路由包括减少冲突、利用动态参数及蓝图;中间件可用于缓存响应、请求验证和异常处理,显著提升性能和可维护性。良好设计是关键,示例代码展示了如何在Flask中实现这些策略。
20 0
|
7天前
|
中间件 数据库 开发者
解析Python Web框架的四大支柱:模板、ORM、中间件与路由
【7月更文挑战第20天】Python Web框架如Django、Flask、FastAPI的核心包括模板(如Django的DTL和Flask的Jinja2)、ORM(Django的内置ORM与Flask的SQLAlchemy)、中间件(Django的全局中间件与Flask的装饰器实现)和路由(Django的urls.py配置与Flask的@app.route()装饰器)。这些组件提升了代码组织和数据库操作的便捷性,确保了Web应用的稳定性和可扩展性。