express中的中间件(middleware)、自定义中间件、静态文件中间件、路由中间件

express文档地址

什么是中间件呢(middleware)?它是谁的中间件呢?

首先我们需要了解到请求和响应,

请求就是客户端发送请求给服务器,

响应就是,服务器根据客户端的请求返回给客户端的数据,

那么中间件,就是当客户端请求服务端时,会向服务器传输一些数据,那么中间件就是处理这些客户端发送往服务器端的数据的,如果一个服务有好多个中间件,那么当客户端向服务器发送请求时,会先经历所有的中间件依次执行完后,再将请求发送给服务器。这就是中间件的作用;

-------------------------------------------------------------------------------------------------------------

 我们先来简单的建一个express中间件,写一个简单的自定义中间件

server.js

var express = require("express");//引入express

var app = express();//创建express实例

app.use(function(req,res,next){//app.use()就是注册中间件的,我们传入的这个函数就是中间件,req代表请求,res,代表响应,next:调用next后会执行下一个中间件,不调用下下一个中间件就不会执行,从而,请求就不会传递到服务器
    console.log("first middleware");
    next();
})

app.use(function(req,res,next){//注册第二个中间件 第二个中间件 等到第一个中间件执行完后 调用next()之后才会执行   同理 一次类推
    console.log("secoded middleware");
    next();
})

app.get("/",function(req,res,next){//next参数可以不传  因为这一步响应就结束了 不用执行next
    res.send("ok")
})

app.listen(3000);
console.log("listening to port 3000")

当然,我们可以提前结束响应,比如我们想在第二个中间件中结束响应,我们可以这样做

var express = require("express");//引入express

var app = express();//创建express实例

app.use(function(req,res,next){//app.use()就是注册中间件的,我们传入的这个函数就是中间件,req代表请求,res,代表响应,next:调用next后会执行下一个中间件,不调用下下一个中间件就不会执行,从而,请求就不会传递到服务器
    console.log("first middleware");
    next();
})

app.use(function(req,res,next){//注册第二个中间件 第二个中间件 等到第一个中间件执行完后 调用next()之后才会执行   同理 一次类推
    console.log("secoded middleware");
    res.send("响应结束");
    // next();
})

app.get("/",function(req,res,next){//next参数可以不传  因为这一步响应就结束了 不用执行next
    res.send("ok")
})

app.listen(3000);
console.log("listening to port 3000")

上面将第二个中间件中的next()注释掉,请求到第二个中间件就会停止,然后,我们调用了res.send()方法,告诉客户,请求结束

下面来看一下middleware的执行顺序,我们另外又增加了一个middleware,在这三个middleware的next()后面都打印出一句话,我们来看看中间件的执行顺序是怎样的

var express = require("express");//引入express

var app = express();//创建express实例

app.use(function(req,res,next){
    console.log("first middleware");
    next();
    console.log("first middleware after");
})

app.use(function(req,res,next){
    console.log("secoded middleware");
    next();
    console.log("secnded middleware after");
})

app.use(function(req,res,next){
    console.log("third middleware");
    next();
    console.log("third middleware after");
})

app.get("/",function(req,res,next){//next参数可以不传  因为这一步响应就结束了 不用执行next
    res.send("ok")
})

app.listen(3000);
console.log("listening to port 3000")

我们来看一下,这六个console打印执行的顺序:

first middleware
secoded middleware
third middleware
third middleware after
secnded middleware after
first middleware after

可以看出,当下一个中间件完全执行完之后,才会去执行上一个中间件的next()后面的语句!!!!

 -------------------------------------------

中间件还可以加一个路径参数,指定是哪个路由下的中间件,如:

app.use("/home",function(req,res,next){//减伤这个路径参数后,只有访问这个home路由时才会执行此中间件!!!
    console.log("third middleware");
    next();
    console.log("third middleware after");
})

------------------------------------------------------------------------------------------------

下面来看一个内置的中间件,响应静态文件的中间件!!!

server.js

var express = require("express");//引入express

var app = express();//创建express实例

app.use(express.static('public'));//express.static是静态文件中间件,里面指定一个文件夹路径(其实就是静态文件的根目录),我们在客户端访问localhost:3000/touxiang.png就可以访问到public目录中的文件

app.listen(3000);
console.log("listening to port 3000")

我们还需要在根路径上建立一个public文件夹,里面放一张图片,加入图片名称叫touxiang.png

那么我们在浏览器上访问localhost:3000/touxiang.png  

我们就可以在浏览器看到 这张图片了

如果我们在public文件夹下再建立个文件夹assets文件夹,里面放一个index.html页面,我们就可以在浏览器这样访问这个html页面:localhost:3000/assets/index.html

如果我们要给静态文件中间件指定一个路由呢?那这些静态文件应该如何访问呢?

先给静态文件加一个路由,加入是assets

app.use("/assets",express.static('public'));

应该这样访问到刚才的俩静态文件

http://localhost:3000/assets/touxiang.png
http://localhost:3000/assets/assets/index.html

只需要在刚才的访问路径前加上这个assets路由即可

我们可以这样理解,express.static('路径')指定的是,当前路由下,静态文件的根目录!!!这样理解就很不错了

 -----------------------------------------------------------------------------------------------------------------

下面来看一下路由中间件

我们之前写的路由接口,都是写在server.js中的,有非常多的app.get(...)和app.post(...),这样都把路由写在一个文件中,就会显的非常臃肿,因为一般的应用都会有好多接口的,那么路由中间件就可以解决这样的问题

加入我们的服务器入口文件里(server.js)有两个路由

var express = require("express");//引入express

var app = express();//创建express实例

app.get("/users",function(req,res,next){
    res.send("users");
})

app.get("/",function(req,res,next){
    res.send("root");
})

app.listen(3000);
console.log("listening to port 3000")

一个根路由,一个users路由,我们想将这两类路由放到其它地方

首先我们在跟目录建立一个routers文件夹,里面分别新建index.js和users.js

index.js内容:

var express = require("express");//引入express
var router = express.Router();//注意Router首字母大写
router.get("/",function(req,res,next){
    res.send("root");
})

module.exports = router;//导出router

users.js内容

var express = require("express");//引入express
var router = express.Router();//注意Router首字母大写
router.get("/",function(req,res,next){//注意 users.js中定义的路由 的路由要改成跟路由"/"
    res.send("users");
})

module.exports = router;//导出router

server.js

var express = require("express");//引入express

var app = express();//创建express实例

var indexRouter = require('./routers/index');//引入跟路由
var usersRouter = require('./routers/users');//引入users路由

app.use("/",indexRouter);//使用中间件
app.use("/users",usersRouter);//使用中间件



app.listen(3000);
console.log("listening to port 3000")

然后我们就可以在浏览器访问localhost:3000和localhost:3000/users    我们就可以得到相对应响应内容了!!

原文地址:https://www.cnblogs.com/fqh123/p/11567603.html