nextjs jwt authentication
1.0.0
Una aplicación de prueba de concepto para demostrar la autenticación de la aplicación Next.js con JWT.
La aplicación se realiza bajo el supuesto de que el servidor de representación y el servidor API están desacoplados.
Utiliza esta API para la autenticación.
Las aplicaciones renderizadas del lado del servidor son increíbles. Hacen un punto óptimo entre las aplicaciones monolíticas y las aplicaciones de una sola página alimentadas por microservicios. Pero también agregan complejidad a su creación. Mantener el estado en el servidor y el cliente sincronizado, enrutando en el cliente y el servidor, cargando datos antes de la representación del servidor, etc. son algunas de las cosas que hacen que nuestras aplicaciones sean más complejas. Es por eso que existen marcos como Next.js, para resolver la mayoría de esos problemas. Sin embargo, cosas como la autenticación nos dejan. Este es un intento de implementar la autenticación basada en JWT. La cuestión es que no podemos almacenar tokens en LocalStorage como lo haríamos con SPA.
La idea es recibir token del servidor en el cliente, almacenarlo en cookies y luego, cada vez que una página se presenta en el servidor, podríamos acceder al token desde la cookie.
El usuario envía una solicitud de Auth desde el cliente. En la respuesta, JWT se recibe y se almacena en las cookies del navegador y la tienda Redux. Luego, el usuario tiene acceso al token desde el cliente y puede usarlo para acceder a las rutas protegidas.
Cuando el usuario realiza una solicitud de página, las cookies también se envían, para que el servidor pueda leerlas. Para leerlo, el usuario está utilizando el método getInitialProps Lifecycle, proporcionado por Next.js. Obtiene un argumento: el objeto de contexto que contiene algunas propiedades. Puedes leer más al respecto aquí. En la propiedad req , podemos acceder a la propiedad headers que contiene la cookie con el token. Se envía un creador de acción para guardar el token en la tienda Redux, y la aplicación ahora tiene acceso al token nuevamente.
Asegúrese de tener el nodo y el NPM instalado.
También asegúrese de tener el servidor API en ejecución.
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
