代理服务器提供静态文件时的404问题求助

当通过https://interfaceserver.com/foo访问时，页面里的<link href="/css/main.css">会让浏览器直接请求https://interfaceserver.com/css/main.css——这个路径不在Apache的代理规则范围内，因此返回404。而直接访问localserver时，/css/main.css会被Express的静态服务正确处理，所以能正常加载。

方案一：修改Express静态文件挂载路径 #

把Express的静态服务挂载到/foo路径下，让静态文件的请求路径带上/foo前缀，匹配Apache的代理规则：

// app.js中修改静态服务配置
app.use('/foo', express.static('public'));

同时调整EJS里的静态文件引用，改为带/foo前缀的绝对路径，或者使用相对路径：

<!-- 带前缀的绝对路径 -->
<link href="/foo/css/main.css" rel="stylesheet" type="text/css">
<!-- 相对路径（适用于页面处于/foo路由下的场景） -->
<link href="./css/main.css" rel="stylesheet" type="text/css">

方案二：扩展Apache代理规则 #

如果不想修改应用代码，可以在Apache配置中新增静态资源路径的代理规则，把/css、/js等静态资源路径也代理到localserver：

ProxyPass "/foo" "http://localserver:8001/foo"
ProxyPassReverse "/foo" "http://localserver:8001/foo"
# 新增静态资源代理规则
ProxyPass "/css" "http://localserver:8001/css"
ProxyPassReverse "/css" "http://localserver:8001/css"
ProxyPass "/js" "http://localserver:8001/js"
ProxyPassReverse "/js" "http://localserver:8001/js"

这种方式无需改动应用代码，但如果静态资源路径较多，配置会相对繁琐。

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