Javascript heap out of memory when using Nuxt auth and axios

user_8810556 0
Viewed 763

I am trying to implement local login in my Nuxt app which uses express server middleware.

I am using the following modules

  1. nuxt auth
  2. axios
  3. passport, passport-local, passport-local-mongoose, passport-session
  4. express-session

But as soon as I set up nuxt auth in my app, the whole app seems to stop responding. I am not able to access any page(not even the login and register page) of my application. After running the server for a while this is what I see. 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
  },
},

},

As per https://github.com/nuxt-community/auth-module/issues/286#issuecomment-461138282, can making requests to server middleware be the cause of this error?

Should I have a separate server for api?

axios nuxt.js passport.js
2 Answers

I've resolved my problem. I was facing the following issue with nuxt-auth https://github.com/nuxt-community/auth-module/issues/286 I had my authentication services and nuxt on the same server, this caused nuxt auth module to go in an infinite loop(more details in the link above). So I created separate servers for the API services and SSR(nuxt).

Following is my nuxt-auth configuration, not much difference.

  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, 
  },
},

},

More importantly, here is my axios configuration. Note that I am making request to a different server.

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

},

Now something unrelated to the original problem, Please also make sure that if you are making API requests from page middleware that proper cookies are sent.

See this link, https://github.com/nuxt/nuxt.js/issues/454 Since page middleware may be executed on the server side in SSR, cookies may not be available there. There are modules that make cookies available on the server side. But instead of that, you can just place you API requests in a method that's executed in the browser, Ex. created, fetch etc.

Sorry I am writing this answer in a hurry, I'll improve it later.

user_88105560

I am facing the same problem. In my case the problem lies in the following auth configuration. It happens on a fresh installation of nuxt:2.14.3, and so it should be easy to reproduce the error. Just adding this config crashes the app. I am using @nuxt/auth-next:^5.0.0-1595976864.509d9d6

// nuxt.config.js
auth: {
    strategies: {
      cookie: {
        cookie: {
          name: 'session',
        },
        endpoints: {
            login: { url: '/api/login', method: 'post' },
            logout: { url: '/api/logout', method: 'post' }
        }
      }
    }
 },
user_31610220
Related