使用Express中间件记录请求时Console.log被调用两次的解决办法咨询

嘿，这个问题我之前也碰到过！其实原因就是浏览器会自动向服务器请求/favicon.ico来显示标签页图标，所以你的中间件会被触发两次——一次是你真正的业务请求，另一次就是这个favicon请求。下面给你几个实用的解决办法：

• 直接在中间件里过滤favicon请求
  这是最简单直接的方式，在你的日志中间件里加个判断，如果请求路径是/favicon.ico，就直接结束响应，不执行日志逻辑和后续中间件：

  app.use((req, res, next) => {
    // 跳过favicon.ico的请求日志
    if (req.url === '/favicon.ico') {
      return res.end(); // 直接结束响应，不继续后续流程
    }
    console.log('Im being called', req.url);
    next();
  });
  

• 使用专门的favicon处理中间件
  Express生态有个serve-favicon包可以帮你规范处理favicon请求，避免浏览器重复发起无效请求，同时也能让你的日志中间件只记录业务请求：

  1. 先安装包：

     npm install serve-favicon
     

  2. 在代码里引入并挂载这个中间件（注意要放在你的日志中间件之前，这样favicon请求会被提前处理，不会走到日志逻辑）：

     const express = require('express');
     const favicon = require('serve-favicon');
     const path = require('path');
     const app = express();
     
     // 先处理favicon请求
     app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
     
     // 你的日志中间件
     app.use((req, res, next) => {
       console.log('Im being called', req.url);
       next();
     });
     

• 让浏览器停止请求favicon
  如果你根本不需要网站图标，可以在页面的<head>里添加一段代码，告诉浏览器不要请求favicon：

  <link rel="icon" href="data:,">
  

  这样浏览器就不会自动发起/favicon.ico的请求了。

内容的提问来源于stack exchange，提问作者Anirudh