Simplified Knowledge Blog

Middlewares no Express: Tudo que você precisa saber!

Podemos falar que middlewares são, Funcões que rodam entre o objeto request e o response de uma aplicação. Com eles, podemos executar qualquer código durante esse processo, encerrar o response ou até mesmo modificar os objetos req e res.

Escrevendo um Middleware simples

Vamos escrever uma função chamada simpleMiddleware como nosso middleware, e depois disso, usaremos app.use(simpleMiddleware) para nosso app.get('/') ter acesso à ela.

const express = require('express')
const app = express()
const simpleMiddleware = (req, res, next) => {
  console.log('Middleware funcionando!')
  next()
}
app.use(simpleMiddleware)
app.get('/', (req, res) => {
  res.send('<h1>Hello World!</h1>')
})
app.listen(3000)

Quando acessamos http://localhost:3000/ vamos receber a mensagem "Middleware funcionando!". Perceba que não vamos receber o console.log() no browser, o Node.js roda no V8 Engine do JavaScript e não tem acesso ao nosso browser!

Usando um Middleware: Global

No exemplo acima, usamos app.use(), se por acaso temos mais rotas neste arquivo, o Middleware será usado em todos, por isso chamados de uso global. É importante resaltar que eles são chamados na ordem que são definidos. Veja o exemplo:

...
app.get("/", (req, res) => {
  res.send("<h1>Hello World!</h1>");
});
app.use(simpleMiddleware)
app.get("/about", (req, res) => {
  res.send("<h1>About Page!</h1>");
});
...

O nosso Middleware apenas será chamado caso hajá alguém acessando a página http://localhost:3000/About, a página principal será ignorada. O uso global pode ser útil quando organizamos as rotas por arquivos e tipos!

Usando um Middleware: Rota

Caso queira usar por rota, você pode adicionar o nome do Middleware entre os objetos req e res. Veja o exemplo

...
app.get("/", simpleMiddleware, (req, res) => {
  res.send("<h1>Hello World!</h1>");
});
...

ou assim

...
app.get("/", (req, res, next) => {
  res.send("<h1>Hello World!</h1>");
});
...

Preferência por Middlewares: Global vs Rota

Saiba que quando usamos app.use(middleware), ele tem uma preferência maior que o por rota, ou seja, ele irá ser chamado primeiro.

app.use(myGlobalMiddleware)
app.get('/about', myRouteMiddleware, (req, res) => {
  res.send('About page')
})
// myGlobalMiddleware é chamado
// myRouteMiddleware é chamado

Comunicação entre Middlewares

Podemos passar informações entre Middleware ao modificar os seus objetos req e res. Veja o exemplo

const autorizarMaioresDeIdade = (req, res, next) => {
  if (req.query.idade >= '18') {
    req.autorizado = true
    next()
  } else {
    res.send('ERRO: Você é menor de idade')
  }
}
app.get('/', autorizarMaioresDeIdade, (req, res) => {
  res.send(`<h1>Página principal <br/> Autorizado = ${req.autorizado} </h1>`)
})

Ao acessar com http://localhost:3000/?idade=18, o Middleware nos autoriza por termos os requisitos necessários, e logo depois, renderiza a página com a mensagem: Autorizado true.

Evite erros usando Middlewares

Nos exemplos anteriores, usamos um if e else para determinar se o usuário é maior de idade, mas e se quisermos "encurtar" o código com a intenção de deixá-lo mais limpo? A primeira coisa que alguém pensa é em deixar assim:

const autorizarMaioresDeIdade = (req, res, next) => {
  if (req.query.idade >= '18') {
    req.autorizado = true
    next()
  }
  res.send('ERRO: Você é menor de idade')
}

O express roda códigos mesmo depois do next(), portanto, o usuário seria autorizado e logo depois receberia um erro! Por mais chato que seja, essa maneira que o express usa em Middlewares abre mais uma oportunidade para que rodamos algum código após o objeto response.