Implementación de Login Seguro con JWT y Cifrado de Contraseñas

Clase 9 de 29 • Curso de Node.js: Autenticación, Microservicios y Redis

Resumen

¿Cómo registramos de manera segura los usuarios en una aplicación?

Al crear aplicaciones web, es crucial garantizar la seguridad de las credenciales de los usuarios. Un error común es almacenar contraseñas en texto plano, lo que puede resultar en filtraciones masivas. Por lo tanto, un buen enfoque es delegar la autenticación a terceros o implementar un sistema seguro en nuestra aplicación.

¿Cómo delegar la autorización a terceros?

Empresas como Facebook y Twitter ofrecen servicios externos de autenticación que facilitan la implementación de un sistema seguro:

OAuth o servicios de terceros: Permiten a los desarrolladores utilizar servicios comunes de autenticación, evitando manejar contraseñas directamente.
Uso de tokens de acceso: Facilitan la sesión de usuarios y el rendimiento de acciones en su nombre.

¿Cómo implementar un sistema seguro de login y cifrado de contraseñas?

Puedes crear un fluido de autentificación y asegurar que las contraseñas no se almacenen en texto plano:

Registro del usuario: Gereamos una sesión con un nombre de usuario (username) y una contraseña (password).
Cifrado de contraseñas: Encriptamos las contraseñas antes de almacenarlas en la base de datos.
Verificación de usuarios utilizando consultas sencillas en la base de datos para verificar la existencia del usuario y la validez de la contraseña.

const data = await store.find({
  table: 'users', 
  query: { username: request.body.username }
});

if (data.password === request.body.password) {
  return generateToken(data);
} else {
  throw new Error("Información inválida");
}

¿Cómo generar un token de acceso?

Para crear un token de acceso se puede usar la librería jsonwebtoken para firmar los datos del usuario, proporcionando un método seguro de autenticación:

const jwt = require('jsonwebtoken');

function signUserToken(userData) {
  return jwt.sign(userData, 'your-secret-key');
}

¿Sobre qué debemos estar atentos?

No guardar contraseñas en texto plano: Almacenar contraseñas cifradas usando técnicas como hashing.
Control de errores: Es esencial manejar los errores sin enviar mensajes detallados que puedan ayudar a un atacante (p. ej., "Información inválida" en lugar de detalles).
Validación regular de tokens: Implementar un proceso de verificación para asegurar que los tokens de acceso son válidos y no han sido comprometidos.

Implementando estos pasos, mejorarás significativamente la seguridad de las credenciales en tu aplicación web. Es momento de poner manos a la obra y reforzar las defensas de tu aplicación. Si tienes interés en profundizar en técnicas de seguridad y cifrado de contraseñas, sigue explorando y mantente actualizado. ¡Es el mejor camino hacia el conocimiento y la excelencia!

Francisco López

student•

Muy buenas clases! Gracias! Una recomendación que no hace al funcionamiento pero ayuda a orientarse mejor respecto al archivo con el que estamos trabajando en cada momento, o localizar más rápidamente los errores, etc: A cada archivo network, controller u otros que se vayan agregando a la app, agregarle el nombre del componente al cual pertence. Por ejemplo: en el caso del componente user: user-network.js, user-controller.js En el caso de auth: auth-network.js, auth-controller.js Esto ayuda también a localizarlo más rápidamente en la función de búsqueda del editor que usemos. !! Obviamente el index.js queda como index.js para que pueda cumplir la función que explica el profesor =) !!

Raul Contreras

student•

Ademas, si es una clase la que exporta el archivo es recomendable poner el nombre en CamelCasing (notación de camello) De esa manera con el nombre de la clase puedes ver lo que exporta

Alver Alexander Grisales Ortega

student•

En mi opinión no veo necesario nombrar los archivos de esa forma porque ya tienes el folder para identificar cada archivo.

Juan Teixeira

student•

hace 4 meses deje este curso en esta clase porque no entendia nada me frustre y lo deje, hoy estoy aqui de nuevo, agarre fuerzas, volvi a ver el curso de node basico que lo dicta Carlos y ahora voy por este video entendiéndolo a la perfección.! 👍🏻

Jean Carlos Hernandez Carrasquel

student•

Recomiendo este paquete module-alias para cambiar

required('../../../auth')

por

required('@auth')

Stiven Castillo Montero

student•

Me gusta más usar Typescript y sus alias

Jean Carlos Hernandez Carrasquel

student•

Me gusta más programar de este modo tipo Error First (debe tener otro nombre) pero siento que es más limpio porque te quita un montón de indexados de bloques. Si alguna validación no cumple retornas o lanzas excepciones, si no, sigues el flujo en el mismo nivel de indexado.

const data = await store.query(TABLA, { username: username });

if (data.password !== password) {
    throw new Error('Informacion invalida')
}
        
// Generar token;
return auth.sign(data);

Reinaldo Mendoza

student•

Es mejor blindar el codigo levantando los errores primero y luego su proseguir si es necesario

Jhonny Barrios

student•

Si, efectivamente tiene otro nombre se llama Return Early Pattern, tambien me gusta mas programar asi, hace que tu codigo sea mucho mas facil de leer

Josué Aaron Campos Brenes

student•

tambien pueden generar el token mediante una promesa y añadiendole un tiempo de expiracion

const jwt = require('jsonwebtoken');

const generateJWT = (id) => {
    return new Promise((resolve, reject)=> {
         const payload = { id };
         jwt.sign(payload, 'secreto', {expiresIn: '1h'}, (err, token)=> {
            if(err){
                console.log(err.message);
                reject('No se pudo generar el token');
            }else{
                resolve(token);
            }
         });
    })
}

module.exports = generateJWT;

Luis Alexander Chip Teleyón

student•

Una clase epica!

Xavier Alberto Garcia Navarro

student•

Alguien que me pueda explicar que sucede aquí con keys?

const query = async (table, q) => {
  let col = await list(table);
  let keys = Object.keys(q);
  let key = keys[0];
  return col.filter((item) => item[key] === q[key])[0] || null;
};```

Sneyder Barreto

student•

¡Hola! Primero se recibe la query en el parámetro llamado q (que es { username: username }), luego de esto se usa Object.keys(q) que nos retorna un array con el nombre de la propiedad de q (en este caso el nombre de la propiedad es "username") y lo guardamos en la variable keys.
Si hacemos un console.log(keys) tendríamos como output:

["username"]

Ahora, para acceder a ese valor, guardamos la referencia en la variable key usando keys[0]. Por último, al filtrar la columna se espera que el valor de item[key] (que sería el username de cada item) sea igual al valor (al username) de la consulta.
Espero esto te aclare un poco más. Recuerda que siempre puedes volver a repetir la clase para aclarar un poco más el tema. Un saludo.

José Antonio Torres

student•

Lo que sucede es que keys crea un array de las llaves que contiene el objeto que le pasaste como parametro a la funcion. Por ende puedes navegar un objeto en bases a sus llaves y poder extraer cualquier informacion o modificar.

En este caso filtra en base a la condicion, si esta se cumple retorne lo que encuentra, sino retorna null.

Briam Martínez Escobar

student•

Una duda, lo único es que al generar el token de acceso, le estamos pasando data del usuario y con ello la contraseña, eso no sería buena práctica no?

Luis Antonio Rodriguez Garcia

student•

lo que pasa es que la contraseña debe ser cifrada antes de enviarse

Rigo Antonio Galicia Barrera

student•

La contraseña no debe de ir en el payload del JWT, aunque este cifrada es información sensible. Puedes revisar esta lectura de Auth0 que habla sobre los claims.

https://auth0.com/docs/tokens/json-web-tokens/json-web-token-claims

Wilson Fernando Antury Torres

student•

La contraseña debería ir en el token? una vez autenticado en el back, por que necesitaría enviar la contraseña en el token?

Daniel Alberto Esquinazi

student•

Supongo que no deberia ir en el payload del jwt, deberiamos removerla

Cesar Merlo

student•

noo! jamas! la contraseña solo se necesita a la hora del login para crear el token... en el token puedes poner el id y el username del usuario

Luis Gerardo López Hernández

student•

Donde esta guardando la informacion del usuario para luego hacer el login? Supongo en cache? Porque el dummy.js siempre sigue igual... El ejercicio si me funciona solo no entendi esa parte

Jorge Carrion

student•

Hola, la data se guarda en el objeto db, como es una variable más, se almacena en la memoria principal (no en la caché) y si sufre cambios los cuales se conservan en memoria hasta que se reinicia la aplicación. Puedes hacer un console.log(db) después de cada método en dummy.js para ver que está cambiando dependiendo de las peticiones que se realicen en la API.

Dilan Santiago Ariza Cañon

student•

Naturalmente en la memoria principal del servidor, cuando realizamos algún cambió en el server y estamos ejecutando con nodemon, este se reiniciara cada vez que le demos al CTR + S

Así que, por eso creamos el usuario cada vez que realizamos un cambió en el server :)

Julian Alves Da Rocha

student•

Mucha repetición de nombres genéricos en carpetas y archivos. realmente confuso

Miguel Angel Reyes Moreno

student•

IMPORTANTE SABER ESTO SI NO USAS bodyParser:

app.use(express.urlencoded({extended: true})) //* Así ya no tenemos que instalar body-parser
app.use(express.json()) //! Pero es importante usar esta línea también

Estuve muchas horas atorado por no saber que tenía que usar la segunda línea.

Fernando Hernandez

student•

que clase de nivel...

Naldo Duran

student•

✌

Maximiliano Emmanuel Alvarez Marchesi

student•

Excelente clase!

Jaime Navarro Rosales

student•

alguien que me explique como funciona lo que hizo en la funcion query del minuto 3:40 me confundio con lo de let keys = Object.keys(q); aiudaaa XD

Miguel Angel Reyes Moreno

student•

No me funciona upsert :/ siempre recibo name y usernmae como undefined y no sé a qué se deba.

Dejo mi código por si alguien me quiere ayudar:

network.js de la carpeta user:

const express = require('express');

const response = require('../../../network/response');
const Controller = require('./index');

const router = express.Router();

// Routes
router.get('/', list);
router.get('/:id', get);
router.post('/', upsert);
router.put('/', upsert);

function list(req, res) {
  Controller.list()
    .then(lista => {
      response.success(req, res, lista, 200);
    })
    .catch(error => {
      response.error(req, res, error.message, 500);
    })
}

function get(req, res) {
  Controller.get(req.params.id)
    .then(user => {
      response.success(req, res, user, 200);
    })
    .catch(error => {
      response.error(req, res, error.message, 500);
    })
}

function upsert(req, res) {
  Controller.upsert(req.body)
    .then(user => {
      response.success(req, res, user, 201);
    })
    .catch(error => {
      response.error(req, res, error.message, 500);
    })
}

module.exports = router;

controller.js de la carpeta user:

//* Debe tener acceso a network

const { nanoid } = require('nanoid');
const auth = require('../auth');

const TABLA = 'user';

module.exports = function(injectedStore) {
  let store = injectedStore;
  if (!store) {
    store = require('../../../store/dummy');
  }

  function list() {
    return store.list(TABLA);
  }

  function get(id) {
    return store.get(TABLA, id);
  }

  async function upsert(body) {
    const user = {
      name: body.name,
      username: body.username,
    }

    if (body.id) {
      user.id = body.id;
    } else {
      user.id = nanoid();
    }

    if (body.password || body.username) {
      await auth.upsert({
        id: user.id,
        username: user.username,
        password: body.password,
      });
    }

    return store.upsert(TABLA, user);
  }

  function remove(id) {
    return store.remove(TABLA, id);
  }

  return {
    list,
    get,
    upsert,
    remove,
  }
}

dummy.js:

const db = {
  'user': [
    { id: '1', name: 'Miguel' },
    { id: '2', name: 'Ángel' },
  ]
}

async function list(table) {
  return db[table] || [];
}

async function get(table, id) {
  let collection = await list(table);
  return collection.filter(item => item.id === id)[0] || null;
}

async function upsert(table, data) {
  if (!db[table]) {
    db[table] = []
  }
  db[table].push(data);

  console.log(db);
}

async function remove(table, id) {
  db[table].splice(id,1)
}

async function query(table, queryParam) {
  let collection = await list(table);
  let keys = Object.keys(queryParam);
  let key = keys[0];
  return collection.filter(item => item[key] === queryParam[key])[0] || null;
}

module.exports = {
  list,
  get,
  upsert,
  remove,
  query
}

Xavier Alberto Garcia Navarro

student•

Alguien que me pueda explicar que sucede aquí con keys?

const query = async (table, q) => {
  let col = await list(table);
  let keys = Object.keys(q);
  let key = keys[0];
  return col.filter((item) => item[key] === q[key])[0] || null;
}```

Santiago Lopera Naranjo

student•

Hola! Alguien podría explicarme en esta función que estoy logrando con el condicional donde pongo body.password || body.username ?

const upsert = async(body) =>{

        const user = {
            name: body.name,
            username: body.username,
            password: body.password
        }

        if(body.id){
            user.id = body.id;
        }else{
            user.id = nanoid()
        }

        if(body.password || body.username){
            await auth.upsert({
                id:user.id,
                username:user.username,
                password: user.password
            })
        }
        
        return store.upsert(TABLA,user)
    }

Andrés Alberto García Ardila

student•

Hola Santiago, en el condicional lo que evalúas es que si ++password++ o ++username++ tienen un valor diferente a null o vacío, pasan estos valores a través de la función upsert del controlador de auth para que a partir del id actualicen estas mismas propiedades en la tabla auth que tenemos en base de datos. . Espero haya sido claro si no, dímelo para explicarlo de mejor forma :)

Santiago Lopera Naranjo

student•

Hola Andres, Si si , ya si me queda mucho mas claro, muchas gracias!

Victor Manuel Lagunas Franco

student•

No se como ustedes ven el curso, pero yo lo veo un poco mal hecho, o es mi forma de ver las cosas o complica mucho las cosas con la clase dummy? , aparte que creo el modo de enseñar es un poco raro porque va haciendo las cosas de algún lado que creo va copiando porque algunas veces se equivoca en los nombres de las variables, aparte que los nombres de los archivos como network queda un poco extraño , tambien las variables en ingles y español me crean una confusion muy grande, soy le único que lo ve asi?.. por ejemplo tambien la variable col, ?? columna? q de query?? o por que q?

RAMIRO ENRIQUE GRISALES NOGUERA

student•

quiza es la forma en como el aprendio o costumbre simplemente, por el ejemplo el archivo de response.js aunque me parece practico, en mi caso me limita, prefiero el manejo de respuestas y errores usando el archivo controller, y la logica y el llamado a la db, uso un archivo service.js, de esa manera separo la responsabilidad, y atomizo un poco mas el codigo, todo depende tambien de la arquitectura que quieras dar en el back

Victor Manuel Lagunas Franco

student•

a mi me confundió demasiado y mejor aprendi desde otro lado, tuve que parar este curso.

Implementación de Login Seguro con JWT y Cifrado de Contraseñas

Introducción al proyecto del curso y su arquitectura

Creación de Backend Complejo con Microservicios y Arquitectura Escalable

Modelado de Datos para una Red Social Básica en SQL

Creando la estructura principal

Configuración de un Servidor API con Express y Node.js

Estructuración de API y Gestión de Datos en JavaScript

Controladores con Inyección de Dependencias en Node.js

Documentación de APIs con Swagger en Node.js

Autenticación basada en tokens

Autenticación y Seguridad con Tokens JWT en Aplicaciones Web

Autenticación de Usuarios con JWT y Gestión de Contraseñas Seguras