I'm trying to figure out the best way to integrate Istio into my app, which consists of a React frontend (served by Nginx) and a Django Rest Framework API. I was able to get it to work using the following nginx config and istio-specific kubernetes files:

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

And the frontend can hit the backend at localhost:443. Note, I'm serving the backend on port 443 (instead of 8000) because of some issue regarding the istio gateway not working with any port other than 80 and 443.

Regardless, this approach exposes BOTH the frontend and backend outside of the cluster, which feels like overkill. Is there anyway to set this up so only the frontend is exposed explicitly and I can proxy the backend through the frontend? Either using istio or nginx?

I may be way off here but sounds like this may be tricky because the client is making the call to the backend. I'd have to figure out a way to make the call inside of the cluster and return it back to the client?