proxy_pass从通配符子域通过NGINX

Question

我试图向访问通配符子域的用户显示一个子文件夹：abc.example.com->example.com/xyz

此NGINX服务器块代码正在工作：

server {
# server name with regexp
server_name ~^(?<sub>[^.]+).example.com$;
# this server catches all requests to xxxx.example.com
# and put "xxxx" to $sub variable
location / {
# finally we want to request different URI from remote server
proxy_pass http://localhost:8000;
# proxy_redirect will rewrite Location: header from backend
# or you can leave proxy_redirect off;
proxy_redirect http://localhost:8000 http://$sub.localhost:8000;
}
[certbot code]
}

(见问题5249883(。

但在替换proxy_pass值时"https://localhost:8000使用"https://localhost:8000/xyz"，我会得到这些错误和一个空白页面：

Uncaught SyntaxError: Unexpected token '<'

在socket.io.js和commons.js.中

我在example.com上运行的应用程序是用React/Gatsby构建的。example.com/demo正在运行。

编辑：我放错了错误信息，当我尝试不同的东西时，这些错误就会出现。

Answer 1

问题是(据我现在所知(，Gatsby在example.com/[script-address]托管脚本，并且使用NGINX proxy_pass，脚本地址也更改为example.com/[subfolder]/[script-aaddress]。

对此的解决方案是在gatsby.config中设置"路径前缀"值，如下所述：Gatsby文档。

通过这样做，我为我的完整应用程序设置了一个前缀，这并不是我真正想做的，因为主应用程序仍然托管在example.com上，我只希望子域被传递到一些子页面。(子域由用户创建，并由主应用程序动态提供服务(。令人惊讶的是，在更改路径前缀后，两个(主应用程序和子域(都能工作。

这似乎只适用于生产构建(构建时必须传递标志(，所以我目前还不确定在开发时该做什么。

如果你知道我如何更好地解决这个问题，请给我发信息：(

感谢伊凡和理查德让我走上正轨！

编辑：资产前缀将是更好的方式：https://www.gatsbyjs.org/docs/asset-prefix/它仍然很丑陋，我认为有办法通过NGINX解决这个问题。我仍然不能以这种方式使用开发构建。

编辑2:在我已经处理了三天之后，我再次试图找到一个类似的问题&幸运的是：https://serverfault.com/questions/840654/nginx-map-subdomain-to-a-subdirectory-on-proxied-server我已将代码更改为：

location    / {
proxy_pass http://localhost:8000/xyz$uri/;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_redirect off;
}

它最终起作用：(