Nuxt.js中间件介绍
分类:计算机 | 前端 | Vue | SSR服务端渲染 | Nuxt.js框架 | 中间件 2040
更新:2020-04-19 12:37:13编辑
参考资料
https://zh.nuxtjs.org/guide/routing#中间件
1 概念解释
中间件,顾名思义,是“中间的软件”,从广义上来说它是介于操作系统和应用程序之间的产品,与业务无关的组件。
在nuxt.js中,中间件是一个js文件,里面有自定义的函数,可以运行在一个页面(page)或一组页面渲染之前。
2 如何使用
每一个中间件应放置在 middleware/ 目录。文件名的名称将成为中间件名称(middleware/auth.js将成为 auth 中间件)。
auth.js的内容如下:
export default function (context) {
context.userAgent = process.server ? context.req.headers['user-agent'] : navigator.userAgent
}
在nuxt.config.js文件中配置中间件
module.exports = {
router: {
middleware: 'auth'
}
}
这样配置以后,在访问nuxt系统的每个路由时都会在页面的渲染之前执行auth.js文件中定义的函数。
在指定的布局或者页面中配置中间件
例如,在pages/index.vue 或者 layouts/default.vue中添加如下配置,就可以在访问指定页面前执行auth.js文件中定义的函数。
export default {
middleware: 'auth'
}
猿导航
阅读排行榜
- 1vue和el-table使用经验-如何刷新表格数据10880
- 2three.js加载3D瓦片和3dtiles数据生成交互式地图的开源项目9445
- 3Microsoft Visual C++ Redistributable是什么,有什么作用?7175
- 4mybatis使用经验——mybatis-spring-boot-starter和mybatis的版本对应关系表(持续更新~)5751
- 5uni-app使用经验—vue页面和html页面如何互相调用接口并传参5436
- 6Spring学习经验—@ResponseBody注解的使用说明4844
- 7Intellij IDEA下的版本控制VCS的启用与关闭4782
- 8Druid异常解决经验—java.sql.SQLException url not set4459
- 9如何用批处理命令(bat脚本)启动和停止windows服务4228
- 10nuxt.js项目中如何添加和使用全局变量4096
- 11解决SpringBoot使用maven下载不了jar包的问题3451
- 12linux中解压tar.gz文件报错“gzip: stdin: invalid compressed data--format violated”3339
- 13nuxtjs asyncData使用经验—如何发起多个axios请求并携带参数3205
- 14在Nuxt.js项目的head中引用外部js文件3040
- 15在NVIDIA控制面板设置参数时提示“拒绝访问 无法应用选定的设置到您的系统”的解决方法之一3018