DEV Community

Discussion on: NextJS and Authentication using OAuth2 and JWT

Collapse
 
flolege profile image
flolege

Hi, many thanks for this guide. It was a great help for me to understand some of the basics. I don't know how often I already read it!

I followed roughly your hints to implement authentication myself. And I stumbled over a question: Using express-session, is it also possible to store the token in the custom _app state, or is it a bad practice? In _app getInitialProps I can get the token from req.session when SSR, and on client-side re-rendering of app, the state is kept.

E.g. given _app (my user = token of your example):

class CustomApp extends App {
constructor(props) {
super(props);

    this.state = { user: this.props.user, openModal: false};        
}

static async getInitialProps({ Component, ctx }) {
    let pageProps = {};     
    let csrfLoginToken;
    let user;

    if (Component.getInitialProps) {
        pageProps = await Component.getInitialProps(ctx);
    }

    if (!process.browser) {         
        //CSRF Token in res.locals when user not set
        csrfLoginToken = ctx.res.locals.csrfLoginToken
            ? ctx.res.locals.csrfLoginToken
            : null;

  //set user      
  //needed for full browser refreshes (via link, adress bar etc..) 
  //because _app loses state in that case, so we have to get it from session during ssr call
  user = ctx.req.session.user 
    ? (ctx.req.session.user)
    : null;

    } else {
        console.log("_app renders on client");
    }

    return { ...pageProps, csrfLoginToken, user }; 
}