浅谈express.js框架中间件（middleware）

2024-09-28 03:03:57

_express.js_作为_Node.js_的老牌框架,是现有框架中最全面的。然而在学习express除了那些api之外，对于框架最重要的就是__中间件__这个概念了。如果理解了，就可以把这个框架玩活了，项目开发肯定会更加顺利，而且还可以开发很多额外的功能，甚至中间件扩展开发。

但是就这么一个东西，是很多学习node.js的小萌新们就算写出一个博客项目，都不知道它到底有啥作用。我当时在理解的时候也花了不少功夫，趁着没有啥工作，给各位学习express.js的一点点我的指导意见。当然，这里面可能也有koa2和egg的忠实粉丝，但其实所有node框架貌似都有这个概念，所以我用express举例子,希望各位将就一下哈，应该都是可以看得懂的。

首先我先来一波官方的解释：

好吧，被这些英语吓到了，来一波译文：

[中间件函数是可以访问请求对象（req）、响应对象（res）和应用程序请求响应周期中的下一个函数的函数。下一个函数是Express路由器中的一个函数，当调用该函数时，它执行当前中间件之后的中间件。

中间件功能可以执行以下任务：

执行任何代码
对请求和响应对象进行更改。
结束请求响应周期。
调用堆栈中的下一个中间件。

终于知道当初的我为毛刚开始理解的时候很困难了，说实在的看得我真的有懵的。幸好，我还是从这个坑爬出来了，我来拉你们一把了。首先我们不去深究概念，直接上一个代码块。

如果我们启动服务，访问'/'路由，会返回"这是一个根路由"，访问router1路由就会得到这是一个"这是一个router1路由的"的信息。这看起来是一个很简单的路由查询，我们理一下过程，这个请求是如何访问到这个路由的呢。

一般来说，一个express框架的项目会写入很多路由，但各位要注意的是，这个请求并不是直接定位到这个路由的，而是一个从上至下匹配的一个过程。

有点乱？没关系我们看图

我们看到这幅图，有一个箭头，从上到下的。什么意思呢，如果用户发了一个这样的请求

GET '/router7'

那么他会从第一个开始一个一个去匹配，知道发现有一个路由名和请求方法都一致的路由，就立马执行里面的代码，并且返回一段文字"这是一个router7路由"。这都很好理解，那么现在我有一个需求，就是不管访问任何一个路由，我都要知道这个访问者的ip地址和访问的目标路由打印出来，生产访问日志。那么怎么做了。

我们分析一波，这段程序是所有的请求都要执行的，如果按照执行顺序的说法，那么这段程序是应该放到所有路由的最前面的，也就是说这段程序是所有路由要经过的一段程序，也就是我们所说的中间件。好的，废话不多说，上代码

const fs = require('fs')
const log = (req,res) => {
  const ip = req.ip,
     route = req.route.path
  const log = `ip:${ip} path:${route}`
   fs.writeFileSync(__dirname + '/log',log)
}

比如现在我有一个log函数，它专门用来记录访问日志的。如何所有的都一起执行了，我们加一段这样的代码

app.use(log)

它加在所有代码的最上面，但是不是加上就完事了，还必须在log函数里面再加一段代码，不然当程序执行到里面之后就出不去了，什么代码了。我们重写log函数

const log = (req,res,next) => {
  const ip = req.ip,
     route = req.route.path
  const log = `ip:${ip} path:${route}`
   fs.writeFileSync(__dirname + '/log',log)
   next()
}

大家有没有看见那个next，它有什么作用了。前面我们提到，它其实就是一个过渡者，主要的作用其实就是经过之后，要继续往下面执行，还是就此终止返回结果。

说的简单一点，就是我们一个http请求，到达我们的node服务器之后，要经历的过程，而每经过一个程序块，就是个中间件，每一个中间件只要有next就会传递到下一个中间件里面，直到服务器res响应结果，整个路由就此结束。

我们整合一下代码。并且精简一下，也跑一遍程序

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

const log = (req,res,next) => {
  const ip = req.ip,
     route = req.route.path
  const log = `ip:${ip} path:${route}`
   fs.writeFileSync(__dirname + '/log',log)
   next()
}

app.use(log)//任何请求都会经过这个log中间件 

app.get('/', (req, res) => {
  console.log(req.route.stack)
  res.send('这是一个根路由!')
})

app.get('/router1', (req, res) => {
  res.send('这是一个router1路由!')
})
app.get('/router2', (req, res) => {
  res.send('这是一个router2路由!')
})

app.listen(3000, () => {
  console.log('app listening on port 3000!')
})

GET '/router2' //打印日志，并且返回结果

这就是一个简单的中间件解释了。大家也可以回去看看你原来写过的代码，是否对之前的use这个玩意有点启发了？

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

浅谈express 中间件机制及实现原理

简介中间件机制可以让我们在一个给定的流程中添加一个处理步骤,从而对这个流程的输入或者输出产生影响,或者产生一些中作用.状态,或者拦截这个流程.中间件机制和tomcat的过滤器类似,这两者都属于责任链模式的具体实现. express 中间件使用案例 let express = require('express') let app = express() //解析request 的body app.use(bodyParser.json()) //解析 cookie app.use(cookieP
express的中间件cookieParser详解

cookieParser中间件用于获取web浏览器发送的cookie中的内容.在使用了cookieParser中间件后, 代表客户端请求的htto.IncomingMessage对象就具有了一个cookies属性,该属性之为一个对象的数组, 其中存放了所有web浏览器发送的cookie,每一个cookie为cookies属性值数组中的一个对象. index.html代码: 复制代码代码如下: <!DOCTYPE html> <html> <head lang="
express的中间件bodyParser详解

bodyParser用于解析客户端请求的body中的内容,内部使用JSON编码处理,url编码处理以及对于文件的上传处理. 下面是一个文件上传的例子. 建立一个1.html页面复制代码代码如下: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>向服务器上传文件</title>
详解express与koa中间件模式对比

起因最近在学习koa的使用, 由于koa是相当基础的web框架,所以一个完整的web应用所需要的东西大都以中间件的形式引入,比如koa-router, koa-view等.在koa的文档里有提到:koa的中间件模式与express的是不一样的,koa是洋葱型,express是直线型,至于为什么这样,网上很多文章并没有具体分析.或者简单的说是async/await的特性之类.先不说这种说法的对错,对于我来说这种说法还是太模糊了.所以我决定通过源码来分析二者中间件实现的原理以及用法的异同. 为了简
node.js 中间件express-session使用详解

本文介绍的关于node.js中间件express-session的相关内容,分享出来供大家从参考学习,下面来一起看看详细的介绍: 一.为什么使用session? session运行在服务器端,当客户端第一次访问服务器时,可以将客户的登录信息保存. 当客户访问其他页面时,可以判断客户的登录状态,做出提示,相当于登录拦截. session可以和Redis或者数据库等结合做持久化操作,当服务器挂掉时也不会导致某些客户信息(购物车)丢失. 二.session的工作流程: 当浏览器访问服务器并发送第一次请
nodejs开发——express路由与中间件

路由通常HTTP URL的格式是这样的: http://host[:port][path] http表示协议. host表示主机. port为端口,可选字段,不提供时默认为80. path指定请求资源的URI(Uniform Resource Identifier,统一资源定位符),如果URL中没有给出path,一般会默认成"/"(通常由浏览器或其它HTTP客户端完成补充上). 所谓路由,就是如何处理HTTP请求中的路径部分.比如"http://xxx.com/users/
express的中间件basicAuth详解

basicAuth中间件为网站添加身份认证功能.在使用了该中间件后, 用户访问网站时必须输入用户名与密码,在用户输入了用户名与密码并通过验证之后才能访问网站. 当用户输入的用户名和密码符合条件,中间件会返回true,允许用户访问网站.否则会返回false.不允许访问网站. 复制代码代码如下: var express=require("express"); var app=express(); app.use(express.basicAuth("gys",&q
express文件上传中间件Multer详解

前言 Express默认并不处理HTTP请求体中的数据,对于普通请求体(JSON.二进制.字符串)数据,可以使用body-parser中间件.而文件上传(multipart/form-data请求),可以基于请求流处理,也可以使用formidable模块或Multer中间件. 1. multer中间件 Multer是Express官方推出的,用于Node.jsmultipart/form-data请求数据处理的中间件. 它基于busboy构建,可以高效的处理文件上传,但并不处理multipart
深入理解nodejs中Express的中间件

Express是一个基于Node.js平台的web应用开发框架,在Node.js基础之上扩展了web应用开发所需要的基础功能,从而使得我们开发Web应用更加方便.更加快捷. 举一个例子: 用node.js实现一个控制台打印"hello server" var http = require('http'); var server = http.createServer(function(req,res){ console.log("hello server"); })
浅谈express.js框架中间件（middleware）

_express.js_作为_Node.js_的老牌框架,是现有框架中最全面的.然而在学习express除了那些api之外,对于框架最重要的就是__中间件__这个概念了.如果理解了,就可以把这个框架玩活了,项目开发肯定会更加顺利,而且还可以开发很多额外的功能,甚至中间件扩展开发. 但是就这么一个东西,是很多学习node.js的小萌新们就算写出一个博客项目,都不知道它到底有啥作用.我当时在理解的时候也花了不少功夫,趁着没有啥工作,给各位学习express.js的一点点我的指导意见.当然,这里面可能
浅谈Express.js解析Post数据类型的正确姿势

一.概念介绍 1.POST请求:HTTP/1.1 协议规定的 HTTP 请求方法有 OPTIONS.GET.HEAD.POST.PUT.DELETE.TRACE.CONNECT 这几种.其中 POST 一般用来向服务端提交数据. 2. Content-Type : 是指 http/https 发送信息至服务器时的内容编码类型, Content-Type 用于表明发送数据流的类型,服务器根据编码类型使用特定的解析方式,获取数据流中的数据.四种常见的 POST 请求的 Content-Type 数据
浅谈node.js中间件有哪些类型

概述 node中间件就是封装在程序中处理http请求的功能.node中间件是在管道中执行.中间件位于客户机/ 服务器的操作系统之上,管理计算机资源和网络通讯. 中间件为主要的逻辑业务所服务,可分为:应用级中间件.路由级中间件.内置中间件.第三方中间件.错误级中间件. 1.应用级中间件每一个中间件就是调用一个函数,需要配合其他的中间件或者路由使用 server (函数) 拦截所有的路由 server.use('/reg',函数):拦截特定的路由 const express=require('ex
浅谈Node.js ORM框架Sequlize之表间关系

Sequelize模型之间存在关联关系,这些关系代表了数据库中对应表之间的主/外键关系.基于模型关系可以实现关联表之间的连接查询.更新.删除等操作.本文将通过一个示例,介绍模型的定义,创建模型关联关系,模型与关联关系同步数据库,及关系模型的增.删.改.查操作. 数据库中的表之间存在一定的关联关系,表之间的关系基于主/外键进行关联.创建约束等.关系表中的数据分为1对1(1:1).1对多(1:M).多对多(N:M)三种关联关系. 在Sequelize中建立关联关系,通过调用模型(源模型)的belon
浅谈nuxtjs校验登录中间件和混入(mixin)

middleware - authLogin.js export default function ({ route, store, redirect, app, req, res }) { // store.state.auth.loggedIn 是否登录 // 权限页面检查登录状态 if (!store.state.auth.loggedIn) { store.commit('changeShowType', 'login'); // 展示登录框或者可以跳转登录页 const query =
浅谈Vue.js

vue.js的总体评价"简单却不失优雅,小巧而不乏大匠" Vue.js简介 Vue.js的作者为Evan You(尤雨溪),任职于Google Creative Lab,虽然Vue是一个个人项目,但在发展前景上个人认为绝不输于Google的AngularJs,下面我会将Vue与Angular(Angular 1.0+版本)做一些简单的比较. Vue的主要特点就和它官网(http://cn.vuejs.org/)所介绍的那样: (1) 简洁 (2) 轻量 (3)快速 (4) 数据驱动 (
浅谈减少Hyperf框架的扫描时间

原因 Hyperf框架为了防止用户更新组件后,代理缓存没有更新导致启动报错.增加了以下钩子. { "scripts": { "post-autoload-dump": [ "init-proxy.sh" ] } } 而init-proxy.sh脚本,会执行php bin/hyperf.php di:init-proxy命令清理代理缓存,并重新生成. $ composer init-proxy > init-proxy.sh ../../ R
浅谈前端JS沙箱实现的几种方式

目录前言 iframe实现沙箱 diff方式实现沙箱基于代理(Proxy)实现单实例沙箱基于代理(Proxy)实现多实例沙箱结束语参考前言在微前端领域当中,沙箱是很重要的一件事情.像微前端框架single-spa没有实现js沙箱,我们在构建大型微前端应用的时候,很容易造成一些变量的冲突,对应用的可靠性面临巨大的风险.在微前端当中,有一些全局对象在所有的应用中需要共享,如document,location,等对象.子应用开发的过程中可能是多个团队在做,很难约束他们使用全局变量.有些页
浅谈Vue.js 1.x 和 2.x 实例的生命周期

在Vue.js中,在实例化Vue之前,它们都是以HTML的文本形式存在文本编辑器中.当实例化后将经历创建.编译.销毁三个主要阶段. 以下是Vue.js 1.x 实例的生命周期图示: Vue.js 1.x 的生命周期钩子 1. init 在实例开始初始化时同步调用.此时数据观测.事件和Watcher都尚未初始化. 2. created 在实例化创建之后同步调用.此时实例已经结束解析选项,已建立:数据绑定.计算属性.方法.Watcher/事件回调,但是还没有开始DOM编译,$el还不存在. 3. b
浅谈react.js中实现tab吸顶效果的问题

在react项目开发中有一个需求是,页面滚动到tab所在位置时,tab要固定在顶部. 实现的思路其实很简单,就是判断当滚动距离scrollTop大于tab距离页面顶部距离offsetTop时,将tab的position变为fixed. 在react中,我在state中设置一个navTop属性,切换这个属性的值为true或者false,然后tab标签使用classnames()这个方法来利用navTop的值添加类名fixed. 一开始我是这样写的: import cs from 'classnam

浅谈express.js框架中间件（middleware）

相关推荐

随机推荐