Nginx proxy_pass 无法加载资产 VueJS

Question

我有 3 个网站并在 docker 端口 8000、8001 和 8002 上运行。

我正在用这个配置来配置 nginx：

server {
server_name my.domain.net;

location / {
  proxy_pass              http://localhost:8000;
  proxy_set_header        Host $host;
  proxy_set_header        X-Real-IP $remote_addr;
  proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
  proxy_set_header        X-Forwarded-Proto $scheme;
}

location /old {
    proxy_pass            http://127.0.0.1:8001;
    proxy_set_header      Host $host;
    proxy_set_header      X-Real-IP $remote_addr;
    proxy_set_header      X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header      X-Forwarded-Proto $scheme;
}

location /new {
    proxy_pass            http://127.0.0.1:8002;
    proxy_set_header      Host $host;
    proxy_set_header      X-Real-IP $remote_addr;
    proxy_set_header      X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header      X-Forwarded-Proto $scheme;
}
}

它适用于位置 /，但适用于没有所有资产的位置 /old 和 /new。我检查元素，对于位置 /old，资产重定向到 http://my.domain.net（绝对找不到 404），它应该是 http://my.domain.net/old/asset.css。

需要建议

请帮忙。

Answer 1

在分别托管在 8081 和 8082 的 new 和 old 应用程序中，在您的配置中添加 assetsDir。

vue.config.js:

module.exports = {
  assetsDir: 'new'
}