GKE环境下NGINX部署的Angular应用无法解析后端服务主机名

核心问题在于：Angular代码运行在用户的浏览器中，而非Pod A的NGINX容器内。浏览器不在K8s集群的私有网络环境里，既无法解析集群内部的Service FQDN（如exampleapp-backend.default.svc.cluster.local），也无法直接访问集群内部的私有IP（如10.60.12.182）。你在Pod A内用curl能成功，是因为Pod本身处于集群网络中，可正常解析和访问内部Service。

解决方案：配置NGINX作为反向代理 #

你需要修改NGINX配置，让它承担反向代理的角色，将前端的API请求转发到后端Service，同时调整Angular代码使用相对路径调用API。

1. 更新NGINX配置

在原有配置中新增一个location块，匹配API请求路径并转发到后端Service：

events {}

http {
  include /etc/nginx/mime.types;

  server {
    listen 80;
    location / {
        root /usr/share/nginx/html;
        index index.html index.htm;
        try_files $uri $uri/ /index.html; # 可选：解决Angular单页应用路由刷新404问题
    }

    # 新增反向代理规则，转发API请求到后端Service
    location /api/ {
        proxy_pass http://exampleapp-backend/api/; # 集群内直接用Service名称即可解析
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }
  }
}

2. 修改Angular代码中的API调用

将绝对路径改为相对路径，这样请求会发送到当前域名的/api路径，由NGINX转发到后端：

public GET_items(): Observable<Item[]> {
    return this.http.get<Item[]>("/api/items")
}

3. 重新部署前端应用

重新构建Angular应用并更新你的<nginx-image-with-angularApp>镜像，然后重启前端Deployment让新配置生效：

# 示例命令，根据你的实际构建流程调整
docker build -t <nginx-image-with-angularApp> .
docker push <nginx-image-with-angularApp>
kubectl rollout restart deployment exampleapp-frontend

验证效果 #

部署完成后，访问Ingress暴露的前端地址，浏览器会发送/api/items请求到NGINX，NGINX作为反向代理将请求转发到后端Service，即可正常获取数据。

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