CloudLinux cPanel环境下Node.js应用HTML外部资源加载失败求助

问题场景 #

• 环境：CloudLinux v7.9.0 STANDARD kvm + cPanel v110.0.24
• Node.js应用配置：
  • webroot：apps/sitecache
  • 应用URL前缀：sitecache
  • 启动文件：app.js
• 问题：访问http://cache.4x4tyres.co.uk/sitecache/test时，页面加载/load.js返回404错误，基础应用功能正常。

相关代码片段 #

路由逻辑（app.js）

app.get(root + '/test', (req, res) => {
    res.sendFile('index.html', { root: __dirname });
});

页面代码（index.html）

<!DOCTYPE html>
<html>
<head>
    <title>Test HTML file</title>
    <script src="/load.js"></script>
</head>
<body>I'm a simple html file</body>
</html>

自动生成的.htaccess（public_html/sitecache目录下）

# DO NOT REMOVE. CLOUDLINUX PASSENGER CONFIGURATION BEGIN
PassengerAppRoot "/home/cache4x4tyresco/apps/sitecache"
PassengerBaseURI "/sitecache"
PassengerNodejs "/home/cache4x4tyresco/nodevenv/apps/sitecache/12/bin/node"
PassengerAppType node
PassengerStartupFile app.js
# DO NOT REMOVE. CLOUDLINUX PASSENGER CONFIGURATION END

问题原因 #

页面中/load.js是根路径请求，会直接访问http://cache.4x4tyres.co.uk/load.js，但你的Node.js应用挂载在/sitecache前缀下，静态资源未放在网站根目录，也未通过Node.js正确映射路径，导致404。

解决方法 #

方法1：修正资源引用路径 #

直接修改index.html中的脚本路径，适配应用前缀：

<!-- 方案A：相对路径（若JS和HTML在同一目录） -->
<script src="load.js"></script>

<!-- 方案B：带应用前缀的绝对路径 -->
<script src="/sitecache/load.js"></script>

注意：使用方案B时，需确保load.js存在于应用可访问的路径（比如应用根目录或后续配置的静态资源目录）。

方法2：用Express托管静态资源目录 #

适合多静态资源的场景，统一管理：

1. 在应用根目录（apps/sitecache）创建public目录，将load.js放入其中。
2. 在app.js的路由定义前添加静态资源托管代码：

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

// 配置静态资源路由：访问 /sitecache/xxx 会映射到 public/xxx
app.use('/sitecache', express.static(__dirname + '/public'));

3. 修改index.html中的引用路径为：

<script src="/sitecache/load.js"></script>

方法3：利用public_html目录存放静态资源 #

将load.js放入public_html/sitecache目录（和.htaccess同目录），然后修改index.html的引用路径为/sitecache/load.js即可。此方法适合希望静态资源和应用代码分离的场景。

socket.io适配提示 #

若后续使用socket.io，需确保客户端连接路径带上应用前缀：

const socket = io('/sitecache');

服务端无需额外特殊配置，只要Express和socket.io的挂载路径匹配即可。

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