时间戳

首页 > 解决方案 > 使用 Nuxt auth 和 axios 时 Javascript 堆内存不足

axios - 使用 Nuxt auth 和 axios 时 Javascript 堆内存不足

问题描述

我正在尝试在使用快速服务器中间件的 Nuxt 应用程序中实现本地登录。

我正在使用以下模块

  1. nuxt 身份验证
  2. axios
  3. 护照，护照本地，护照本地猫鼬，护照会话
  4. 快速会话

但是一旦我在我的应用程序中设置了 nuxt auth，整个应用程序似乎停止响应。我无法访问我的应用程序的任何页面（甚至登录和注册页面）。在运行服务器一段时间后，这就是我所看到的。https://i.stack.imgur.com/pl0Li.png

auth: {
redirect: {
  login: "/login", // User will be redirected to this path if login is required.
  home: "/", // User will be redirect to this path after login. (rewriteRedirects will rewrite this path)
  logout: "/login", // User will be redirected to this path if after logout, current route is protected.
  user: "/user",
  callback: "/",
},
strategies: {
  local: {
    endpoints: {
      login: {
        url: "/api/login",
        method: "post",
        propertyName: "token",
      },
      logout: { url: "/api/logout", method: "post" },
      user: { url: "/", method: "get", propertyName: "user" },
    },
    tokenRequired: true, //True by default
    tokenType: "bearer",
    // globalToken: true,
    // autoFetchUser: true
  },
},

},

根据https://github.com/nuxt-community/auth-module/issues/286#issuecomment-461138282，向服务器中间件发出请求是否会导致此错误？

我应该有一个单独的 api 服务器吗？

标签： axiospassport.jsnuxt.js

解决方案

我已经解决了我的问题。我在使用 nuxt-auth https://github.com/nuxt-community/auth-module/issues/286时 遇到了以下问题，我的身份验证服务和 nuxt 在同一台服务器上，这导致 nuxt auth 模块进入无限循环（上面链接中的更多详细信息）。所以我为 API 服务和 SSR(nuxt) 创建了单独的服务器。

以下是我的 nuxt-auth 配置，差别不大。

  auth: {
redirect: {
  login: "/register", 
  home: "/", 
  logout: "/register",
  user: "/user",
  callback: "/",
},
strategies: {
  local: {
    endpoints: {
      login: {
        url: "/login",
        method: "post",
        propertyName: "token",
      },
      logout: { url: "/logout", method: "post" },
      user: { url: "/user", method: "get", propertyName: "user" },
    },
    tokenRequired: false, 
    tokenType: false, 
  },
},

},

更重要的是，这是我的 axios 配置。请注意，我正在向不同的服务器发出请求。

axios: {
baseURL: "http://localhost:5000/",
credentials: true,
init(axios) {
  axios.defaults.withCredentials = true;
},

},

现在有一些与原始问题无关的问题，如果您从页面中间件发出 API 请求，请确保发送了正确的 cookie。

请参阅此链接，https://github.com/nuxt/nuxt.js/issues/454 由于页面中间件可能在 SSR 的服务器端执行，因此那里可能无法使用 cookie。有一些模块可以在服务器端使用 cookie。但取而代之的是，您可以将 API 请求放在在浏览器中执行的方法中，例如。创建，获取等

抱歉，我正在匆忙写这个答案，我稍后会改进它。

推荐阅读