特定页面上的中间件 - NuxtJS

Question

好吧，我从nuxt开始，我有以下路线：

/home

/dashboard

/login

我想保护/dashboard，但仅限于在Cookie中使用令牌登录的用户。

然后我创建了一个中间件

/middleware/auth.js

import Cookie from 'js-cookie'

export default function({ req, redirect }) {
  if (process.server) {
    if (!req.headers.cookie) return redirect('/login')
    const jwtCookie = req.headers.cookie.split(';').find(c => c.trim().startsWith('jwt='))
    if (!jwtCookie) return redirect('/login')
  } else {
    const jwt = Cookie.get('jwt')
    if (!jwt) { window.location = '/login' }
  }
}

并在我的布局或仪表板页面中注册中间件

<script>
export default {
  middleware: 'auth',
}
</script>

当我访问/dashboard显然工作完美

但问题是中间件是全局注册的，它运行在所有页面上，所有路由上

因此，当您访问已发布页面的/home时，如果您没有cookie，则最终会被重定向到登录页面

有人帮忙吗？

Answer 1

在我看来，你应该称它们为plugin，因为每个路由调用的中间件也改变了你也不能在布局和subComponent中使用中间件，你可以将它用作plugin并在任何地方手动调用它也是它的反应和运行时。

 path: /plugind/auth.js

 import Cookie from 'js-cookie';

 export default function({ req, redirect }) {
 if (process.server) {
   if (!req.headers.cookie) return redirect('/login')
    const jwtCookie = req.headers.cookie.split(';').find(c => 
    c.trim().startsWith('jwt='))
    if (!jwtCookie) return redirect('/login')
    } else {
    const jwt = Cookie.get('jwt')
   if (!jwt) { window.location = '/login'
   }
  }
 }