Um aplicativo de prova de conceito para demonstrar autenticação do aplicativo Next.js com JWT.
O aplicativo é feito sob a suposição de que o servidor de renderização e o servidor de API estão desacoplados.
Ele usa essa API para autenticação.

Os aplicativos renderizados pelo lado do servidor são incríveis. Eles fazem um ponto ideal entre aplicativos monolíticos e aplicativos de página única alimentados por microsserviços. Mas eles também acrescentam complexidade à sua criação. Manter o estado no servidor e o cliente em sincronia, roteando no cliente e no servidor, carregando dados antes da renderização do servidor etc. são algumas das coisas que tornam nossos aplicativos mais complexos. É por isso que estruturas como o Next.js existem, para resolver a maioria desses problemas. No entanto, coisas como autenticação são deixadas para nós. Esta é uma tentativa de implementar a autenticação com base no JWT. O fato é que não podemos armazenar tokens no LocalSorage, como faríamos com o spa.
A idéia é receber token do servidor no cliente, armazená -lo em cookies e, sempre que uma página renderizar no servidor, poderíamos acessar o token do cookie.
O usuário envia uma solicitação de autenticação do cliente. Na resposta, o JWT é recebido e armazenado em cookies de navegador e loja Redux. Em seguida, o usuário tem acesso ao token do cliente e pode usá -lo para acessar rotas protegidas.
Quando o usuário faz uma solicitação de página, os cookies também são enviados, para que o servidor possa lê -los. Para lê -lo, o usuário está usando o método getInitialProps Lifecycle, fornecido pelo Next.js. Ele recebe um argumento - o objeto de contexto que contém algumas propriedades. Você pode ler mais sobre isso aqui. Na propriedade req , podemos acessar a propriedade headers que contém o cookie com o token. Um criador de ação é despachado para salvar o token na loja Redux, e o aplicativo agora tem acesso ao token novamente.
Verifique se você tem o nó e o NPM instalado.
Verifique também se você tem o servidor API em execução.
git clone https://github.com/alan2207/nextjs-jwt-authentication
cd nextjs-jwt-authentication
npm install # Run in dev mode:
npm run dev
# Run in production:
npm run build
npm start