如何为嵌入Dify应用的URL添加子路径并配置Ingress移除子路径

在网页中嵌入Dify应用页面，因网络原因需在原iframe的src中添加proxy/dify子路径以路由至不同服务。原iframe与Ingress配置可正常访问，但添加该子路径并配置Ingress重写规则后出现default backend-404错误，开发者工具显示同时存在带与不带子路径的请求。推测可能是未修改iframe内部的src等内容，但不知其他实现方法，寻求解决办法。

原正常配置 #

iframe代码 #

<iframe
 src="http://my.com/chatbot/abcdefg"
 style="width: 100%; height: 100%; min-height: 700px"
 frameborder="0"
 allow="microphone">
</iframe>

Ingress配置 #

apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  annotations:
    nginx.ingress.kubernetes.io/service-upstream: "true"
    nginx.ingress.kubernetes.io/ssl-redirect: "false"
  name: proxy
spec:
  rules:
    - host: my.com
      http:
        paths:
          - path: /
            backend:
              serviceName: dify
              servicePort: 80

报错时的配置 #

iframe代码 #

<iframe
 src="http://my.com/proxy/dify/chatbot/abcdefg"
 style="width: 100%; height: 100%; min-height: 700px"
 frameborder="0"
 allow="microphone">
</iframe>

Ingress配置 #

apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  annotations:
    nginx.ingress.kubernetes.io/service-upstream: "true"
    nginx.ingress.kubernetes.io/ssl-redirect: "false"
    nginx.ingress.kubernetes.io/rewrite-target: /$1
    nginx.ingress.kubernetes.io/use-regex: "true"
    nginx.ingress.kubernetes.io/preserve-host: "true"
    nginx.ingress.kubernetes.io/enable-cors: "true"
  name: proxy
spec:
  rules:
    - host: my.com
      http:
        paths:
          - path: /proxy/dify/(.*)
            backend:
              serviceName: dify
              servicePort: 80

解决办法 #

1. 补充Ingress路径匹配规则 #

当前Ingress仅匹配带/proxy/dify前缀的请求，但Dify应用内部会用相对路径加载静态资源、发起API请求（比如/static/js/main.js、/api/chat），这些请求不带前缀，导致Ingress无法匹配返回404。需添加额外路径规则覆盖这类请求：

apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  annotations:
    nginx.ingress.kubernetes.io/service-upstream: "true"
    nginx.ingress.kubernetes.io/ssl-redirect: "false"
    nginx.ingress.kubernetes.io/rewrite-target: /$1
    nginx.ingress.kubernetes.io/use-regex: "true"
    nginx.ingress.kubernetes.io/preserve-host: "true"
    nginx.ingress.kubernetes.io/enable-cors: "true"
  name: proxy
spec:
  rules:
    - host: my.com
      http:
        paths:
          # 处理带proxy/dify前缀的初始请求
          - path: /proxy/dify/(.*)
            backend:
              serviceName: dify
              servicePort: 80
          # 处理Dify内部发起的静态资源、API请求
          - path: /(static|api|chatbot)/(.*)
            backend:
              serviceName: dify
              servicePort: 80

2. 配置Dify的Base URL（推荐） #

如果Dify支持配置Base URL，直接在应用配置中设置根路径前缀为/proxy/dify/，这样应用内部所有请求都会自动带上该前缀，无需额外Ingress规则。

以环境变量方式配置为例，给Dify服务添加：

BASE_URL=/proxy/dify/

重启Dify服务后，保持iframe的src为http://my.com/proxy/dify/chatbot/abcdefg即可正常访问，Ingress配置可沿用报错时的版本。

3. 独立Nginx反向代理（备选） #

若Ingress配置受限，可在Dify服务前部署独立Nginx实例，配置反向代理规则覆盖所有请求：

server {
  listen 80;
  server_name my.com;

  # 处理带proxy/dify前缀的请求
  location /proxy/dify/ {
    rewrite ^/proxy/dify/(.*)$ /$1 break;
    proxy_pass http://dify-service:80/;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
  }

  # 处理Dify内部静态资源请求
  location /static/ {
    proxy_pass http://dify-service:80/static/;
  }

  # 处理Dify内部API请求
  location /api/ {
    proxy_pass http://dify-service:80/api/;
  }
}

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