Express 中间件被多次调用

Question

My middlewares are getting called multiple times and I can't figure out why. It's a really short code and it is very frustrating as I just started learning express and node. I don't understand why it's even getting into the second middleware, I didn't use next() , I used res.send() .

I am taking an online course and it's the same code as it is described. I also searched stackoverflow but nothing helped. I did read something about the favicon that calls it a second time, but I can't figure out why this is getting called multiple times.

const express = require("express");
const app = express();

app.use("/", (req, res, next) => {
    console.log("This always runs!");
    next();
});

app.use("/add-product", (req, res, next) => {
    console.log("In first middleware!");
    res.send("<h1>Add Product</h1>");
});

app.use("/", (req, res, next) => {
    console.log("In second middleware!");
    res.send("<h1>Hello from express!</h1>");
});

app.listen(3000);

If I'm opening localhost:3000/add-product I should get in the console:

This always runs!
In first middleware!

but I actually get:

This always runs!
In first middleware!
This always runs!
In second middleware!
This always runs!
In first middleware!

Could it be that the favicon automatically executes all middlewares once? I added this code before the first app.use() call:

app.get("/favicon.ico", (req, res) => res.status(204));

Now I get

This always runs!
In first middleware!
This always runs!
In first Middleware!

I still get it twice.

edit edit edit:

This appears only to happen in chrome.

Answer 1

Don't use app.use for routes that's mainly used for middleware registration you want to use the router. https://expressjs.com/en/4x/api.html#app.use

app.(post|get|delete|put)("route", function(req,res,next){})

in your case it's best to see if your browser is requesting 2 http calls. If so it'll double up.

Answer 2

The browser is sending a request for a favicon. Press F12 on chrome and you will see two requests being made. One of them will be local host and other one will be favicon.ico. Therefore you are seeing two sets of console.log() being printed out to the console.

Instead of reinstalling chrome you could just right click on favicon.ico and click on Block request URL to stop the browser from sending requests for favicon.ico

Answer 3

Problem solved: I reinstalled Chrome and it works fine now. Thanks all!