如何在Express中同时实现静态文件托管与根路径代码执行？

问题出在Express中间件/路由的匹配顺序上：express.static中间件会自动查找托管目录下的index.html作为根路径/的默认响应。当你先注册了app.use('/', express.static('./public'))，用户访问/时，这个中间件会先匹配到请求，直接返回index.html，后续的app.get('/')路由就不会被执行了。

下面提供几种可行的解决方案：

方案1：调整路由与静态中间件的注册顺序 #

把你的根路径GET路由放在静态文件托管中间件之前注册。这样访问/时会先触发自定义代码，你可以选择继续交给静态中间件返回页面，或者自行处理响应：

// 先注册根路径的GET路由
app.get('/', function (req, res, next) {
  // 这里执行你的自定义代码
  console.log('用户访问了站点根路径');
  
  // 如果需要返回public目录下的index.html，调用next()交给静态中间件处理
  next();
  
  // 如果你想返回自定义内容，直接用res.send()/res.render()等替代next()
  // res.send('欢迎访问站点');
});

// 再注册静态文件托管
app.use('/', express.static('./public'));

方案2：用中间件包装静态文件托管 #

如果不想调整顺序，或者需要在静态文件返回前后执行代码，可以用自定义中间件包裹express.static，判断请求路径后执行逻辑：

const path = require('path');

app.use('/', function(req, res, next) {
  // 仅在访问根路径时执行代码
  if (req.path === '/') {
    console.log('用户访问了站点根路径');
  }
  // 调用静态中间件处理请求
  express.static(path.join(__dirname, './public'))(req, res, next);
});

方案3：禁用静态中间件的默认索引文件 #

通过index: false关闭express.static自动返回index.html的行为，然后在GET路由里手动处理根路径请求：

const path = require('path');

// 禁用默认索引文件
app.use('/', express.static('./public', { index: false }));

app.get('/', function(req, res) {
  // 执行自定义代码
  console.log('用户访问了站点根路径');
  // 手动返回public目录下的index.html
  res.sendFile(path.join(__dirname, 'public', 'index.html'));
});

选择哪种方案取决于你的具体需求：如果需要在返回页面之前执行逻辑，方案1最直接；如果要保留静态中间件的优先顺序，方案2更合适；如果需要完全控制根路径的响应内容，方案3是最佳选择。

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