node-js Express中间件

中间件介绍

  1. 什么是中间件
    中间件其本质就是一个回调函数,可以像路由一样访问请求对象(request)和响应对象(response)。
  2. 中间件的作用是什么
    通过函数封装公共操作,简化代码
  3. 中间件类型
    • 全局中间件
    • 路由中间件

全局中间件的实现

例子:简单实现一个log日志,记录每次访问url地址及时间

js 复制代码
	const express = require('express')
	const path = require('path')
	const fs = require('fs')
	const app = express()
	// 声明中间件函数
	function middlewarw(req,res,next) {
	    let {url} = req
	    // 加这一步是因为默认会先访问favicon.ico文件,为了显示跳过对 favicon.ico 的处理
	    if (url === '/favicon.ico') {
	        return next();
	    }
	    // 获取时间
	    const now = new Date();
	    // 简便用了toISOString()方法,复杂的处理可以使用dayjs
	    const timestamp = now.toISOString().replace('T', ' ').slice(0, 19);
	    // 通过fs模块将记录写入文件
	    fs.appendFileSync(path.resolve(__dirname+'/record.log'),`${url} ${timestamp}\r\n`)
	    // next是为了上面执行完成后 继续执行后续的方法
	    next()
	}
	// 声明完成中间件要通过下面方式调用
	app.use(middlewarw)
	
	app.get('/index',(req,res)=>{
	    res.send('首页')
	})
	app.get('/admin',(req,res)=>{
	    res.send('管理系统首页')
	})
	// 错误处理
	app.all('*',(req,res)=>{
	    res.send('<h1>404</h1>')
	})
	// 监听端口
	app.listen('3000',()=>{
	    console.log('启动成功');  
	})

上面的逻辑就实现了一个全局中间件,这样即便有再多的访问路径,也都会被记录到log文件中。

运行程序会看到当前目录下会生成一个log文件,打开文件查看内容,就会看到我们想要的结果

路由中间件

实现一个简单的路由中间件(示例),与全局路由不同的是中间件函数要放到路由中执行

js 复制代码
const express = require('express')

const app = express()

// 中间件函数
const routeMiddlewarw = (req,res,next)=> {
    // 假设访携带code值1则有访问权限
    if(req.query.code === '1'){
        // 继续执行后续
        next()
    }else{
        res.send('没问访问权限')
    }
}

// 中间件函数 放到第二个参数执行
app.get('/index',routeMiddlewarw,(req,res)=>{
    res.send('首页')
})

app.get('/admin',routeMiddlewarw,(req,res)=>{
    res.send('管理系统首页')
})

app.all('*',(req,res)=>{
    res.send('<h1>404</h1>')
})

app.listen('3000',()=>{
    console.log('启动成功'); 
})

实际运行前后对比

静态资源中间件

创建静态目录

在html中引用css

js 复制代码
const express = require('express')
const app = express()

// 设置静态资源中间件
app.use(express.static(__dirname + '/publick'))

// 路由
app.get('/',(req,res)=>{
    res.send('首页')
})

app.all('*',(req,res)=>{
    res.send('<h1>404</h1>')
})

app.listen('3000',()=>{
    console.log('启动成功'); 
})

启动之后访问3000端口

也可以尝试这样访问

注意事项

  1. index.html文件,是默认打开的资源文件,比如http:localhost:3000,这样直接就访问到了index.html
  2. 静态资源和路由规则,谁先匹配就优先响应谁也可以理解为谁先执行谁先响应。例如:
    这样就会优先访问到首页这个页面。
相关推荐
hai_android4 小时前
一个公式看懂动态跨表查找:P8 + VLOOKUP
前端·javascript·vue.js
杨利杰YJlio4 小时前
Tibo的28天计划DAY1GPT-6提速50%意味着什么?
前端·javascript·后端
鬼手点金4 小时前
opencode-全能开发者配置
java·linux·服务器·前端·javascript·学习·前向传播
OpsEye5 小时前
兼顾数据安全与成本,私有化 AI 网关正在成为企业标配
javascript·ai编程
铁皮饭盒6 小时前
还是网页端, 46mb模型, 抠图功能升级了, 抠任意主体, 还是不要显卡, 不要python, 满意吗?
前端·javascript·后端
福兮说6 小时前
IP 地址转整数的七个坑:192.168.1.1 算出负数、127.1 也是合法地址、存进 INT 直接溢出
javascript·网络·网络协议·tcp/ip·mysql·golang
YQteamdyq6 小时前
为什么 { ...state } 会悄悄杀掉响应式?yq-sanyi v0.4.2 的三处修复
前端·javascript
anew___7 小时前
《从零手写操作系统 (29):管道与重定向进阶——命名管道、Here Document与Shell语法扩展》
java·开发语言·前端·javascript·网络
光影少年8 小时前
如果 React 组件的属性没有传值,它的默认值是什么?
前端·javascript·react.js
Helix2509 小时前
2026编程入门指南:零基础如何科学选择第一门编程语言?
java·c语言·javascript·零基础·编程语言·python入门·编程就业