Kubernetes中React Pod无法连接Express Pod的解决方案咨询

问题根源 #

核心问题在于React代码运行在用户浏览器中，而非前端Pod内部：

• 后端Pod能通过database-service:27017访问MongoDB，是因为K8s集群内部DNS可解析ClusterIP服务域名，且集群内Pod间能直接访问ClusterIP端口。
• 但浏览器属于集群外部环境，既无法解析backend-service这类集群内部域名，也无法访问ClusterIP类型服务的端口，直接用http://backend-service:5001必然失败。

标准解决方案 #

方案1：将后端服务改为NodePort（开发环境常用） #

NodePort类型服务会在集群每个节点上暴露一个端口，外部可通过节点IP+NodePort访问服务。

修改后端服务配置：

apiVersion: v1
kind: Service
metadata:
  name: backend-service
spec:
  selector:
    app: backend
  ports:
    - protocol: TCP
      port: 5001
      targetPort: 5001
      nodePort: 30001 # 可选，指定30000-32767范围内端口，不指定则自动分配
  type: NodePort

获取minikube节点IP：

minikube ip

更新前端Deployment的环境变量：

env:
  - name: REACT_APP_API_URL
    value: "http://<minikube-ip>:30001" # 替换为实际minikube IP

方案2：使用Ingress（生产环境推荐） #

Ingress是K8s中统一管理外部访问集群服务的方案，支持域名路由、SSL等功能，适合生产环境。

步骤1：启用minikube Ingress插件

minikube addons enable ingress

步骤2：创建前端ClusterIP服务（若未配置）

apiVersion: v1
kind: Service
metadata:
  name: frontend-service
spec:
  selector:
    app: frontend
  ports:
    - protocol: TCP
      port: 3001
      targetPort: 3001
  type: ClusterIP

步骤3：配置Ingress资源

apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:
  name: app-ingress
  annotations:
    nginx.ingress.kubernetes.io/rewrite-target: /$2
spec:
  rules:
    - host: app.local # 自定义本地域名
      http:
        paths:
          - path: /api(/|$)(.*)
            pathType: Prefix
            backend:
              service:
                name: backend-service
                port:
                  number: 5001
          - path: /
            pathType: Prefix
            backend:
              service:
                name: frontend-service
                port:
                  number: 3001

步骤4：配置本地hosts文件

在本地/etc/hosts（Linux/macOS）或C:\Windows\System32\drivers\etc\hosts（Windows）中添加一行：

<minikube-ip> app.local # 替换为实际minikube IP

步骤5：更新前端环境变量

env:
  - name: REACT_APP_API_URL
    value: "http://app.local/api"

此时访问http://app.local即可打开前端，前端会通过Ingress路由访问后端API。

方案3：开发环境临时调试方案（端口转发） #

如果只是临时调试，可直接用kubectl port-forward将后端服务端口转发到本地：

kubectl port-forward service/backend-service 5001:5001

然后前端环境变量设为：

env:
  - name: REACT_APP_API_URL
    value: "http://localhost:5001"

这种方式无需修改服务配置，适合快速调试，但重启终端后需重新执行命令。

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