API REST con Autenticación JWT con JSON Server y jsonwebtoken

  • Por
Cómo crear un API REST en 30 segundos, con funciones de autenticación basadas en JWT (JSON Web Token) usando JSON Server y jsonwebtoken.

En este artículo te voy a enseñar cómo puedes crear en menos de 10 minutos un API REST con autenticación basada en JSON Web Token (JWT), con prácticamente cero configuración, ideal para prototipar aplicaciones frontend SPA.

La base de este proyecto es JSON Server, del que ya hemos tenido ocasión de hablar. JSON Server permite crear un API REST a partir de un archivo JSON que tengas en tu disco duro, aportando un servidor capaz de recibir operaciones GET, PUT, DELETE, etc. Como ya hemos presentado este software en otra ocasión, lo vamos a dar por entendido. Puedes acceder al artículo anterior donde se explica JSON Server con mayor detalle.

El extra que venimos a relatar en esta ocasión es el sistema de autenticación para API REST basado en token. JSON Server no tiene implementada una autenticación, por lo que sólo con él no era posible prototipar aplicaciones con partes restringidas por login (usuario y contraseña). Disponer de ello es interesante para poder desarrollar una parte tan importante en un proyecto como es la autenticación.

Nota: Para saber más sobre la autenticación por token te recomendamos la lectura del artículo Autenticación por token que aborda muchos conceptos que te aclararán este modelo popular para la seguridad de las aplicaciones.

Pero lo cierto es que, tal como está construído JSON Server es bien sencillo crear un sistema que, apoyándose en él, pueda restringir ciertos recursos del API, de modo que sólo estén disponibles para usuarios correctamente autenticados.

"JSON Server" y JWT Auth

En este proyecto de Github encontramos todo lo que necesitamos para desplegar tu API REST en 30 segundos (lo que tardas en escribir un comando de consola), con la autenticación por JWT incorporada de casa. Se trata de un proyecto en el que tengo varias ideas para mejorarlo, pero que se puede usar perfectamente ya.

Puedes encontrar el repositorio en GitHub en este enlace: https://github.com/deswebcom/json-server-with-jwt-auth

Como había mencionado, básicamente implementa otro software "open source" bastante popular, llamado JSON Server, al que hemos agregado una autenticación básica basada en JSON Web Token.

A continuación dejo una traducción al español del archivo del README.md, en el que doy los detalles para usar el software y para poder configurarlo con nuestro propio juego de datos.

Instrucciones específicas para montar y configurar el servidor REST con autenticación JWT

Una vez clonado o descargado el repositorio en tu ordenador local, lo único que debes hacer para poner en marcha tu API REST con autenticación es lanzar la ejecución del archivo de arranque, llamado "index.js".

node index

Cuando invocamos así la ejecución del archivo index.js, el software arranca con las configuraciones definidas como predeterminadas.

  • JSON server arranca en el puerto 3000
  • Como juego de datos usa el archivo que se encuentra en la ruta: "json-samples/default.json".
  • Retardo de 1500 milisegundos en la respuesta

Argumentos de arranque

Puedes configurar el servidor de tu API con autenticación a través de argumentos en la llamada a node index.

  • --file sirve para indicar la ruta a otro fichero json con los datos del API.
  • --port sirve para indicar el puerto de arranque
  • --authentication sirve para poder definir si queremos autenticación o no.
  • --delay: indicar el tiempo de retraso en la respuesta.

Por ejemplo, este comando arranca otro archivo JSON como modelo de datos y escucha en el puerto 3000. Además arranca con el sistema de autenticación funcionando. (Ver más adelante las rutas que están protegidas y las rutas que están libres, así como las rutas para loguear y crear nuevos usuarios).

node index --file=./json-samples/series.json --port=3333

Este segundo comando, aparte de configurar la ruta y el puerto, indica que no se desea autenticación.

node index --file=./json-samples/marcadores.json --port=3333 --authentication=no

Otra modificación que he realizado a JSON Server y que me viene muy bien para simular mejor cómo funcionan las API REST es la creación de un tiempo de retardo en la respuesta. Así, aunque tengas funcionando el API en local, el servidor tardará en responder como si fuera un servidor en remoto, pudiendo percibir efectos como la típica ruedita del ajax rodando mientras se espera la respuesta.

Si quieres, puedes quitar el retardo en la respuesta, o configurarlo de otra manera, puedes hacerlo con el argumento "delay", tal como sigue:

node index --file=./json-samples/series.json --delay=0

El retardo se mide en milisegundos. De modo que, si quieres indicar el tiempo de retardo a medio segundo podrías arrancar con:

node index --delay=500

Rutas para el sistema de autenticación

Las siguientes rutas te sirven para implementar el flujo para autenticación.

  • Login: /login
  • Registro: /sign-in
  • Verificar un usuario: /verify

Para usar las rutas del login y registro se deben enviar solicitudes "POST" a esas rutas, indicando el usuario a registrar o autenticar mediante un objeto JSON que colocaremos en el cuerpo de la solicitud. Esa parte la tendrás que hacer con tu librería o framework Javascript preferido.

El objeto que colocarás en el body del request será algo como esto:

{email: "desarrolloweb@example.com", password: "1234"}

La ruta de verificación de un usuario "/verify" sirve para comprobar si el token que tenemos sobre un usuario supuestamente autenticado es válido. Para esa comprobación tendrás que enviar el token desde el cliente, a través de las cabeceras de la solicitud HTTP.

{
  "Content-Type': "application/json",
  "token": "Aquí_colocas_el_token"
}
Nota: en esta versión comentada de este sistema de autenticación los datos de los usuarios se almacenan simplemente en la memoria de Node. Por ello, con cualquier reinicio del servidor, todos los usuarios se pierden.

Para facilitar el flujo de trabajo, cuando el servidor del API REST se inicia, se crea directamente un usuario en la memoria, que puedes usar para tus pruebas, sin que tengas que registrarte.

  • email: user@example.com
  • password: 1234

Además, si tienes un mínimo conocimiento de Javascript y NodeJS, podrías editar el archivo index.js para configurar este usuario con otros datos, o añadir al setup otros usuarios que se creen automáticamente cuando el servidor se reinicia.

Rutas protegidas y rutas públicas

De manera que en tus aplicaciones puedas jugar con distintos tipos de rutas, tanto públicas como restringidas, hemos realizado este programa colocando rutas que no requieren autorización. El criterio que se ha seguido es el siguiente:

  • Todas las rutas de tipo GET al API REST se consideran rutas públicas, en las cuales no se verifica que haya un usuario correctamente autenticado.
  • Todos los demás métodos del HTTP (POST, PUT, DELETE...) están detrás de rutas autenticadas, para las que se realiza el proceso de verificación del usuario.

Para verificar el usuario en una ruta autenticada se hace el mismo proceso que se describió en la ruta "/verify". Es decir, tienes que enviar en las cabeceras del HTTP el token de autenticación válido. En caso que no se envíe el token, o el mismo sea incorrecto o haya caducado, el servidor responderá con un error 401.

El token se envía en las cabeceras, de una manera como esta:

{
  "Content-Type': "application/json",
  "token": "Put_here_the_token"
}

Espero que con estas notas puedas crear tu propio sistema de API REST con autenticación JWT de una manera ágil y puedas desarrollar tu proyecto frontend con un servidor estándar y extremadamente fácil de configurar.

Autor

Miguel Angel Alvarez

Miguel es fundador de DesarrolloWeb.com y la plataforma de formación online EscuelaIT. Comenzó en el mundo del desarrollo web en el año 1997, transformando su hobby en su trabajo.

Compartir