Express项目静态资源加载失败，持续报404错误求助

你的问题出在静态资源的路径配置和引用方式上，以下是具体的修复步骤：

1. 修正Express静态文件中间件的路径 #

你当前用app.use(express.static("public"))是相对脚本启动路径的相对路径，而从res.sendFile的../index.html可以看出，你的HTML文件在脚本目录的上级，所以public目录大概率也在上级目录，应该用绝对路径来定位public，避免路径歧义：

// 替换原来的静态中间件配置
app.use(express.static(path.join(__dirname, "../public")));

2. 调整HTML中的资源引用路径 #

当你访问/war这类路由时，浏览器会把./index.js解析成/war/index.js，而不是根目录下的静态资源。所以要把资源路径改成根路径开头（以/开头），直接指向public目录下的文件：

<!-- 修正图片路径 -->
<img src="/assets/images/cards/black_joker.png" height="300px" id="p1Card">
<img src="/assets/images/cards/red_joker.png" height="300px" id="p2Card">

<!-- 修正JS文件路径 -->
<script src="/index.js"></script>

3. 确认目录结构正确性 #

确保你的项目目录结构符合以下逻辑（关键是静态资源要放在public目录内）：

项目根目录/
├── public/
│   ├── assets/
│   │   └── images/
│   │       └── cards/
│   │           ├── black_joker.png
│   │           └── red_joker.png
│   └── index.js
├── 你的脚本目录/ (比如src/)
│   ├── 你的路由文件.js
│   └── server.js
├── index.html
├── start.html
└── finalScore.html

完成以上三步后，重启服务，静态资源应该就能正常加载了。

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