nginx 二级目录反向代理是不是有先天缺陷?

68 天前
 kyonn

如下一个最简化的反代配置,将本地 80/443 端口的 /git/ 反代到本地容器的 8085 端口。

访问 127.0.0.1/git/ 成功跳转到 8085 端口容器的 web 页面,但是发现有诸多问题:

  1. css 和 png 加载失败。抓了下调试信息,发现是容器返回的样式等文件地址都是绝对路径 /,进而导致浏览器请求样式文件时,没有正确走 location /git/ 的反代。通过 sub_filter 指令批量替换后解决了。
  2. 问题 1 解决后,点击其它页面元素,还是会出现 404 错误。原因同 1

类似这种二级目录的反向代理,是不是天然有缺陷,没办法像 二级域名 或 三级域名 反代那样完美实现?

注:

  1. 域名管理不在手上,添加多个二级或三级域名比较麻烦,所以考虑的是同一个域名下的子目录。
  2. 可以修改反代 upstream docker 的配置,因为是自己部署的。
location /git/ {
    proxy_http_version 1.1;
    proxy_pass http://192.168.1.13:8085/;
}
3952 次点击
所在节点    NGINX
40 条回复
perfectlife
68 天前
个人感觉这不是 nginx 的缺陷,是 http://192.168.1.13:8085 服务的问题 ,服务里比如 index.html 里面使用的 css png js 资源地址用的是绝对路径,用相对路径就没问题了
RobinHuuu
68 天前
目录反带得结合 rewrite 规则,把你的需求喂给 ai ,ai 给你写
momocraft
68 天前
先看看你要反代的服务有没有路径设置
SanjinGG
68 天前
看样子是你打包没用相对路径吧
kyonn
68 天前
@momocraft 是指 contextpath 吗?让被代理的容器 web 服务在 contextpath 而不是 / ?
kyonn
68 天前
@RobinHuuu 可能我问法不太正确,AI 给出的答案也都是有问题的。
kyonn
68 天前
@perfectlife
@SanjinGG
被代理的容器是现成的开源项目。直接通过容器端口访问是正常的。

根据[这篇文档]( https://blog.csdn.net/jiabeis/article/details/100974516)的意思,是必须使用 contextpath 功能才能支持二级目录反代?
perfectlife
68 天前
@kyonn 直接访问端口时 根目录是 / ,访问正常是预期的现象, 你反代时根目录是/git/了, 绝对路径就会出错了, 三楼说的对,要先看这个开源项目支持不支持路径设置, 比如你用 nginx 使用/kibana 反向代理 kibana ,你就需要在 kibana 里设置 server.basePath: "/kibana"
maocat
68 天前
浏览器路径加/git/是人为操作,同理,如果需要浏览器自动加载/git/静态资源,是不是需要在代码里提前配置/git/ ?,解决方法,1 ,前端编译时项目加上/git/,2. 所有静态资源文件由后端推送,3,直接 nginx 转发静态文件
看你的描述,我猜测你部署的是 coze
momocraft
68 天前
@kyonn 问我没用,我都不知道你要代理什么服务
duanxianze
68 天前
确实有先天缺陷,比如 cookie,localStorage 不能隔离等等问题,但你这个问题纯粹是你没写对
totoro625
68 天前
proxy_pass 的服务器不支持自定义为 example.com/git/为主页的话
直接自己手搓规则
由简到繁观察请求路径,例如 A 只请求很少的几个文件夹路径,就单独为 A 写
例如 A 请求/_nuxt 和 /css/main.css (如果与主站点重复,需要人为修改主站点 css 请求路径,或子站点请求路径)
location /_nuxt {
proxy_pass http://192.168.1.13:8085/_nuxt;
}
location /css/main.css {
proxy_pass http://192.168.1.13:8085/css/main.css;
}
skiy
68 天前
你在主机上面 curl http://192.168.1.13:8085 看看页面上的 URL 正常吗。
Alfchao
68 天前
前端资源要用相对路径,和 nginx 没关系
tsja
68 天前
全栈前端表示,每次部署新项目都会被 nginx 折磨半天,有的问题 AI 也解决不了
jspatrick
68 天前
@kyonn #7 我觉得 4L 正解,问题应该是出在前端打包上
如果是 webpack ,参考 https://www.webpackjs.com/configuration/output/#outputpublicpath
如果是 vite ,参考 https://cn.vitejs.dev/config/shared-options.html#base
Charles0929
68 天前
nginx 二级代理需要上游服务支持,比如 web 打包需要增加通用前缀,这种 vite 等插件是支持配置的,如果是其他语言,比如 java 一类,springboot 也有 servlet-context-path 这些配置
Suaxi
68 天前
反代二级目录,vue + webpack 的话 可以通过 config 的 publicPath 来配置

ps:能用二级域名尽量用二级域名
hugozach
68 天前
代码写的问题就代码的问题 还怪上 nginx 了
itechify
68 天前
南无阿弥陀佛 还是二级域名减轻心智负担

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/1149767

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX