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

什么是中间件呢(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 我们就可以得到相对应响应内容了！！

巴特西

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

最新文章

热门文章