Next.js: Session management with Next.js

[daotrungkien]

I am very new and migrating to Next.js. Maybe this is a dumb question but I did not find much information on it. So far I have successfully made Next.js work with express but now I want to be able to manage session information. I used to use express-session middleware, which attaches session data to the req object of express on every HTTP request, but I don't know how to get it works with Next.js.

By the way, please show me how to access to the req object from a React component also.

[timneutkens]

By the way, please show me how to access to the req object from a React component also.

You can't, data should be extracted in getInitialProps.

Here's an example on how to do authentication / holding session state: https://github.com/zeit/next.js/tree/canary/examples/with-cookie-auth

[nitin-malhotra]

I am very new and migrating to Next.js. Maybe this is a dumb question but I did not find much information on it. So far I have successfully made Next.js work with express but now I want to be able to manage session information. I used to use express-session middleware, which attaches session data to the req object of express on every HTTP request, but I don't know how to get it works with Next.js.

By the way, please show me how to access to the req object from a React component also.

Hi, what you have to only do is to pass the cookies to the server so when it again hits the server the session will not be undefined so the cookies you have recieved in your request will be passed to the server by this way. I have implemented it using req object i got in context object so you can try this most probably this works if you code is correct.
```
static async getInitialProps(ctx) {
try{

let url = ctx.req ? ctx.req.protocol + '://' + ctx.req.get('host') : '';
const res = await fetch(url + '/dashboardData/',{
    headers: {
        cookie: ctx.req ? ctx.req.headers.cookie : null ,
    }
})
const json = await res.json()
  if (json && json.error) {
          return { 'error': 'Something went wrong' }

  }
  return {
    data : json.data
  }
  }catch(error){

console.log(error);
}
}

[eyaleizenberg]

@nitin-malhotra you are the hero we don't deserve. Thank you!

[chiqui3d]

@nitin-malhotra with the user data you do so you don't ask for it again and again?
Do you save it in localStorage when you login? or is there some other way?

[vvo]

Since this question is the top result for "nextjs session" on google, I thought I would add that nowadays you have multiple solutions for handling sessions in Next.js:

• next-iron-session: https://github.com/vvo/next-iron-session. Rails like sessions where the data is encrypted inside http-only cookies. Stateless sessions if you prefer. Perfect for serverless environments where you don't have/want to have a store like Redis to store session data. I am the author of this library.
• next-session: https://github.com/hoangvvo/next-session. Store agnostic session management, you have a session id in a cookie that is then matched server side to a store of your choice (redis, mongo, ..)
• NextAuth.js: https://github.com/nextauthjs/next-auth. Authentication library that also provides session management. This means you can use this to authenticate users through various providers (google, github), and then store this in a session. This supports JWT or database like sessions (redis, mongo..)

Good luck!