así que configuré una aplicación express básica que sirve un archivo estático desde un directorio llamado público.
El directorio público contiene 3 archivos "index.html", "script1.js", "script2.js" y "script3.js". Los archivos de script son solo archivos .js vacíos.
índice.html
<!DOCTYPE html> <html lang="en"> <head> <title>Document</title> </head> <body> <h1>Middleware</h1> <script src="./script1.js" crossorigin="anonymous"></script> <script src="./script2.js" crossorigin="anonymous"></script> <script src="./script3.js" crossorigin="anonymous"></script> </body> </html>
servidor.js
const express = require('express') const path = require('path') const app = express() app.use((req, res, next) => { console.log('middleware was ran', new Date()) next() }) app.use(express.static(path.resolve(__dirname, 'public'))) app.listen(3000, () => { console.log('listening on port 3000') })
Cada vez que ejecuto el archivo server.js y visito la ruta '/', obtengo una salida adicional de "middleware se ejecutó" en la consola para cada archivo de script que incluyo. En este caso, mi salida sería:
listening on port 3000 middleware was ran 2022-06-11T21:45:21.609Z middleware was ran 2022-06-11T21:45:21.644Z middleware was ran 2022-06-11T21:45:21.648Z middleware was ran 2022-06-11T21:45:21.650Z
¿Por qué está pasando eso?
Sí, esto es normal. Cualquier archivo importado (que el navegador aún no haya almacenado en caché) genera una solicitud a su servidor para obtener ese archivo JS importado. Dado que parece que tiene su servidor configurado para usar express.static()
para servir esos archivos, entonces cualquier middleware ANTES de su middleware express.static()
verá esas solicitudes.
Dado que su middleware express.static()
"manejará" la solicitud y no continuará con el enrutamiento, cualquier middleware después de express.static()
no se ejecutará cuando express.static()
sirva un archivo estático. El middleware coincide y se ejecuta en el orden declarado hasta el punto en que un controlador de solicitudes (middleware o no) envía una respuesta y detiene el enrutamiento adicional al no llamar a next()
.
¿Hay alguna forma de limitar eso?
Si coloca su middleware express.static()
primero, entonces satisfará estas solicitudes de archivos estáticos primero y cualquier middleware que lo siga no se ejecutará.
const express = require('express'); const path = require('path'); const app = express(); // put this first so static files are served first // and any other middleware after this won't execute app.use(express.static(path.resolve(__dirname, 'public'))); app.use((req, res, next) => { console.log('middleware was ran', new Date()); next(); }); app.listen(3000, () => { console.log('listening on port 3000'); });