反向代理下如何将静态站点根目录置于子目录？

你的问题核心是静态站点使用了根路径（/开头）的资源引用，导致浏览器从主域名根目录请求资源，而非/foo/子路径。以下是两种可行的解决方法：

方法一：通过Nginx配置修正路径 #

修改location /foo的配置，既调整请求转发规则，又替换响应中的资源路径：

server {
  listen 443 ssl;
  server_name example.com;

  ssl_certificate /etc/letsencrypt/live/example.com/fullchain.pem;
  ssl_certificate_key /etc/letsencrypt/live/example.com/privkey.pem;

  location / {
    proxy_set_header Host $host;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto https;
    proxy_read_timeout 3600;

    proxy_pass http://example-site/;
  }

  # 修改后的/foo路径配置
  location /foo/ {
    proxy_set_header Host $host;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto https;
    proxy_read_timeout 3600;

    # 将/foo/xxx重写为/xxx后转发给后端
    rewrite ^/foo/(.*)$ /$1 break;
    proxy_pass http://example-web-foo/;

    # 替换响应中根路径的资源引用为/foo/前缀
    sub_filter 'href="/' 'href="/foo/';
    sub_filter 'src="/' 'src="/foo/';
    # 确保替换所有匹配项，而非仅第一个
    sub_filter_once off;
  }
}

关键说明： #

• 把location /foo改为location /foo/，避免误匹配类似/foobar的路径
• rewrite规则会剥离请求URL中的/foo/前缀，让后端站点正常处理请求
• sub_filter会替换HTML响应中所有以/开头的href和src属性，让浏览器从/foo/路径请求资源

方法二：修改静态站点的资源引用规则 #

如果有权限修改静态站点代码，这是更彻底的方案：

• 在所有HTML文件的<head>标签中添加<base href="/foo/">，这样所有根路径的资源引用会自动带上/foo/前缀
• 或者将资源引用改为相对路径（比如把/assets/css/style.css改为./assets/css/style.css，需根据文件层级调整）

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