vue.js - Nuxt SSR - 我无法检查用户是否通过身份验证

Question

我正在尝试使用带有 session 身份验证的 Django 后端的 Nuxt SSR 前端。
我想在我的前端有一些 SSR 页面以及客户端呈现的页面，所以我正在使用 通用模式 .
问题是我没有找到一种有效的方法来在加载页面之前检查用户是否经过身份验证，所以我不能将页面限制为匿名用户。为了检查用户是否通过身份验证，Django 将检查请求的 header 是否包含 cookie，并根据该返回用户是否通过身份验证。
这是我尝试过的:
1) 中间件

export default async function ({context, redirect}) {
  axios.defaults.withCredentials = true;

  return axios({
    method: 'get',
    url: 'http://127.0.0.1:8000/checkAuth',
    withCredentials: true,
  }).then(function (response) {
    //Redirect if user is authenticated
  }).catch(function (error) {
    console.log(error)
  });
}

在这里，我向我的后端发送请求以检查用户是否已通过身份验证。问题是中间件是从服务器端执行的，这意味着请求中永远不会有任何 cookie，即使用户通过身份验证。这意味着每次我刷新页面时，根据中间件，用户始终是匿名的，即使用户已通过身份验证。
2) 插件

export default function (context, inject) {
  if (process.client){
    console.log('client')
    return axios({
      method: 'get',
      url: 'http://127.0.0.1:8000/checkAuth',
      withCredentials: true,
    }).then(function (response) {
      //IF AUTHENTICATED, REDIRECT
      context.redirect('/')
    }).catch(function (error) {
      console.log(error)
    });
  } else {
    console.log('server')
  }
}

在这里，我正在尝试相同但使用插件的方法，并且仅当插件从客户端执行时，我才“强制”插件检查用户是否在后端进行了身份验证。这是有效的，cookies 在头中发送，Django 接收 cookie，但这个解决方案的问题是 Nuxt 不允许从插件重定向到其他页面( https://github.com/nuxt/nuxt.js/issues/4491 )。
3) 在 Vue 中使用 beforeMount()
我尝试使用 来做到这一点beforeMount() 来自我的 Vue 页面，但问题是因为它将在 idration 之后执行，页面将被加载并且在 1/2 秒后发生重定向，这有点难看。
有没有办法做到这一点？任何形式的建议表示赞赏
编辑:问题是 不是 我不知道如何编码，问题是当 Nuxt 从服务器端中间件向我的后端发送请求时，该请求将不包含任何 cookie，因此我的 Django 后端无法检查 session cookie，这意味着后端无法检查用户是否通过身份验证。同码 作品 当中间件从客户端执行时(如果我直接导​​航到页面而不是刷新)，因为请求将包含 cookie。
我试图了解这是否正常，但这可能是 issue与 Nuxt。

Answer 1

我确实有一个可用的中间件

export default ({ redirect, store }) => {
  if (store?.$auth?.$state?.loggedIn) {
    redirect('https://secure.url')
  } else {
    redirect('https://login.please')
  }
})