Nuxt3中如何让部分页面跳过全局中间件

我太懂这种需求了——全局中间件确实能省不少事，不用挨个页面去注册，但总有那么几个特殊页面不想让它生效，总不能去给每一个页面手动调整中间件配置吧？其实你想到的自定义页面元数据的思路完全是最优解，我给你把具体实现步骤理清楚：

第一步：在需要跳过的页面添加标记 #

在那些不需要该全局中间件的页面（比如some-ex-page.vue）里，通过definePageMeta添加一个自定义属性来标记，就像你设想的那样：

<script setup lang="ts">
definePageMeta({
  // 自定义属性，名字可以自己取，只要语义化就行
  skipMyMid: false
});
</script>

这里的属性名我改成了skipMyMid，你也可以用myMid: false，只要后面中间件里判断的名字对应上就好。

第二步：在全局中间件里添加判断逻辑 #

打开你的全局中间件文件myMid.global.ts，在执行核心逻辑之前，先检查当前页面的元数据里有没有这个跳过标记，如果有就直接返回，不执行后续逻辑：

export default defineNuxtRouteMiddleware((to) => {
  // 检查当前页面是否设置了跳过该中间件的标记
  if (to.meta.skipMyMid === false) {
    // 直接返回，跳过中间件逻辑
    return
  }

  // 这里写你原本的全局中间件核心逻辑
  // 比如权限验证、用户状态检查、数据预取等操作
})

为什么这是最好的方式？ #

• 完全贴合你的需求：大部分页面自动生效全局中间件，只需要给少数例外页面加一行配置，不用动其他页面
• 比用路由名称判断更可靠：不用担心路由重命名、新增页面漏加判断的问题
• 比手动给每个页面注册中间件高效太多：不用重复劳动，也不会因为漏注册导致问题

备注：内容来源于stack exchange，提问作者none