Middleware para HttpErrors

Espero les sirvan mis apuntes:
Crear middleware de tipo error:

//Creamos función que nos hará llegar a un middleware de tipo error:
function logErrors(err, req, res, next) {
  console.error(err); //mostrar el error en servidor para poder monitorearlo
  next(err); //importante para saber que se esta enviando a un middleware de tipo error, si no tiene el error dentro entonces se esta mandando a uno normal
}

// Crear formato para devolverlo al cliente que se complementa con la función anterior:
function errorHandler(err, req, res, next) { //así no se utilice next en el código se debe poner aqui, ya que un middleware de error tiene los cuatro parámetros
  res.status(500).json({ //indicar que el error es estatus 500 Internal Server Error
    message: err.message, //mostrar al cliente el mensaje de error
    stack: err.stack, //mostrar info del error
  })
}

module.exports = { logErrors, errorHandler }; //exportarlo como modulo

Implementar middleware:

// Importar middleware
const { logErrors, errorHandler } = require('./middlewares/errorHandler'); //importar las funciones que se uilizarán

Los middlewares de tipo error siempre deben ir después de definir el routing.

routerApi(app);
// Utilizamos los middleware. Siempre deben ir después del routing:
app.use(logErrors);
app.use(errorHandler);

Es importante el orden en que se coloquen porque es el orden en que se ejecutarán. En este caso el logErrors es el único con un next, por lo tanto, si se colocará el errorHandler antes, ahí terminaría el proceso.

Además de lo anterior, el error se debe capturar de forma explicita en el router:

// Encontrar un producto por su id:
router.get('/:id', async (req, res, next) => { //se agrega el next
  try {
    const { id } = req.params;
    const product = await service.findOne(id);
    res.json(product);
  } catch (error) {
    next(error); //se agrega el next para atrapar de forma explicita el error con el middleware
  }
});

500 Internal Server Error

Importantísimo el manejo de errores con sus respectivos status dependiendo del error.

El middleware de manejo de errores se define al final, después de otras llamadas de rutas y app.use(); por ejemplo:

https://expressjs.com/es/guide/error-handling.html

El problema por el que no funcionaba el middleware por defecto es porque la función es asíncrona.

Buscando un poco encontré que Express por defecto no pasa los errores asíncronos a los middleware de error, por lo que había que capturar el error y pasarlo al next en cada función de routing, como se hace en la clase. Pero eso debería hacerse en cada función controller, haciéndose repetitivo. Encontré este paquete que agrega a express la forma de manejar los errores asíncronos, así el middleware funcionará como esperábamos.

npm install express-async-errors

Solo debemos importarlo en el index.js y la función de routing quedará como estaba.

require("express-async-errors"); 

“Si estuvieras trabajando con typescript esto no ocurriría”. Punto para Typescript! ❤️

Importante: Los middlewares de error deben ejecutarse después de definir el routing. De no ser así no serán capturados (No funcionará).

Yo tuve problemas con el error middleware, no lo estaba tomando.

hasta que me di cuenta que era un problema con la firma

y encontre esto en la documentación

Error-handling middleware always takes four arguments. You must provide four arguments to identify it as an error-handling middleware function. Even if you don’t need to use the next object, you must specify it to maintain the signature. Otherwise, the next object will be interpreted as regular middleware and will fail to handle errors.

siempre hay que agregar los cuatro parámetros aunque no se usen

Mi error handler:

Mi Index implementando error handler:

Mi servicio arrojando errores como todo un campeon:

Mi router implementando el error handler a trav’es de next:

Yo parando la clase para revisar como podria hacer handling de los diferentes status de errores y despues de romperme la cabeza, sigo viendo el video y me doy cuenta que el profe lo reconoce y dice que lo vamos a trabajar…

Yo que vengo de otros lenguajes, veo a los Middlewares como un interceptor. En donde toma la petición http (Caso de Uso) hace algo con eso, y la procesa o descarta.

👽 Quizás este equivocado, pero lo veo así.

Me recuerdan a los interceptores de Angular.

Se me hacen muy similares a las promesas

cuando estilas hasta el middleware xD

const logger = require("../utils/logger");

function logHandler (error, req, res, next) {
  logger.debug('MIDDLEWARE', error)
  next(error);
};

function errorHandler (error, req, res, next) {
  res.status(500).send(responseError({
    name: error.name,
    message: error.message,
    stack: error.stack
  }))
};

const responseError = ({
  name,
  message,
  stack
}) => `
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>${name} - MIDDLEWARE</title>
    <style>
      *{
        font-family: 'JetBrainsMono Nerd Font Propo', 'Open Sans', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
      }
    </style>
  </head>

  <body>
  <div style='padding-block:40px; padding-inline:40px;'>
    <h2>Error message: ${message}</h2>

    <span style='font-weight:100'>STACK: </span>

    <pre style='font-size:12px'>${stack}</pre>
  </div>
  </body>
</html>
`

function logErrors (err, req, res, next) {
  console.log('logErrors');
  console.error(err);
  next(err);
}

function errorHandler (err, req, res, next) {
  console.log('errorHandler');
  res.status(500).json({
    message: err.message,
    stack: err.stack,
  });
}

module.exports = { logErrors, errorHandler }

Muy bien con los errores.