使用istio或nginx通过前端的代理后端

Question

我试图找出将Istio集成到我的应用程序中的最佳方法，该方法由React前端（由Nginx提供）和Django Rest Framework API组成。我可以使用以下nginx配置和特定于istio的kubernetes文件使其工作：

server {
    listen 80;
    root /app/build;

    location / {
        try_files $uri $uri/ /index.html;
    }
}

# Source: myapp/gateway.yaml
apiVersion: networking.istio.io/v1alpha3
kind: Gateway
metadata:
  name: myapp-gateway
spec:
  selector:
    istio: ingressgateway # use istio default controller
  servers:
    - port:
        number: 80
        name: http
        protocol: HTTP
      hosts:
        - '*'
    - port:
        number: 443
        name: https
        protocol: HTTP
      hosts:
        - '*'
---
# Source: myapp/virtual-service.yaml
apiVersion: networking.istio.io/v1alpha3
kind: VirtualService
metadata:
  name: myapp
spec:
  hosts:
    - '*'
  gateways:
    - myapp-gateway
  http:
    - match:
        - port: 80
      route:
        - destination:
            host: frontend-svc
            port:
              number: 80
    - match:
        - port: 443
      route:
        - destination:
            host: backend-svc
            port:
              number: 8000

并且前端可以在localhost:443到达后端。请注意，由于some issue regarding the istio gateway not working with any port other than 80 and 443，我在端口443（而不是8000）上为后端提供服务。

不管怎样，这种方法都将前端和后端同时暴露在集群外部，这感觉有些过头了。无论如何要进行设置，以便仅显式公开前端，并且我可以通过前端代理后端？使用istio还是nginx？

我可能离这里很远，但是听起来这可能很棘手，因为客户端正在向后端发出呼叫。我必须找出一种在集群内部进行调用并将其返回给客户端的方法？

Answer 1

据我所知，它应该像这样工作。

user -> istio ingressgateway -> istio virtual service -> frontend service -> nginx -> backend service

Istio虚拟服务应该看起来像这样，因此只暴露前端，然后您将nginx配置为通过前端代理后端。

apiVersion: networking.istio.io/v1alpha3
kind: VirtualService
metadata:
  name: myapp
spec:
  hosts:
    - '*'
  gateways:
    - myapp-gateway
  http:
  - route:
    - destination:
        host: frontend-svc
        port:
          number: 80

---

[起初，我建议您阅读有关Connect a Front End to a Back End Using a Service的kubernetes文档，更具体地说，请参阅将前端与后端服务连接在一起的nginx configuration。

---

以及一些django + react教程可能会有所帮助：

• https://medium.com/@gazzaazhari/django-backend-react-frontend-basic-tutorial-6249af7964e4
• https://blog.miguelgrinberg.com/post/how-to-create-a-react--flask-project
• https://felipelinsmachado.com/connecting-django-reactjs-via-nginx-using-docker-containers/
• https://github.com/felipelm/django-nginx-reactjs-docker

Answer 2

最后通过执行基于路径的路由解决了这个问题（感谢@DavidMaze提供有用的评论）：

# Source: myapp/gateway.yaml
apiVersion: networking.istio.io/v1alpha3
kind: Gateway
metadata:
  name: myapp-gateway
spec:
  selector:
    istio: ingressgateway # use istio default controller
  servers:
    - port:
        number: 80
        name: http
        protocol: HTTP
      hosts:
        - '*'
---
# Source: myapp/virtual-service.yaml
apiVersion: networking.istio.io/v1alpha3
kind: VirtualService
metadata:
  name: myapp
spec:
  hosts:
    - '*'
  gateways:
    - myapp-gateway
  http:
    - match:
        - uri:
            prefix: '/api'
      route:
        - destination:
            host: backend-svc
            port:
              number: 8000
    - route:
        - destination:
            host: frontend-svc
            port:
              number: 80