Serving a static react application behind a Kubernetes Ingress

Question

I'm currently trying to setup a react SPA as a deployment/service on kubernetes. Like the backend services I have running currently, I want to be able to hit it behind an Ingress.

Because the SPA is just a bunch of static files, I'm exposing the files through nginx. The container that runs in the deployment has nginx installed to serve the static assets ( nginx -g daemon off in the docker file). This works completely fine if I expose the deployment with a LoadBalancer , but if I use an Ingress, I get no response. Are there any special things to consider when serving static assets behind an ingress? Or any known references/resources for doing this?

Here's my ingress.yml:

apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  name: web-ingress
  annotations:
    kubernetes.io/ingress.global-static-ip-name: web-static-ip
    nginx.ingress.kubernetes.io/rewrite-target: /$1
spec:
  rules:
  - host: api.my-domain.com
    http:
      paths:
        - backend:
            serviceName: web-backend-service
            servicePort: 80
  - host: app.my-domain.com
    http:
      paths:
        - backend:
            serviceName: web-frontend-service
            servicePort: 80

Answer 1

You need to have an ingress controller deployed on your cluster for an ingress resource to actually take effect . Here is the installation guide of Nginx ingress controller.An example ingress to serve static content would look like below.

apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  name: web-ingress
  annotations:
    kubernetes.io/ingress.class: "nginx"
    nginx.ingress.kubernetes.io/add-base-url: "true"
    nginx.ingress.kubernetes.io/rewrite-target: /
spec:
  rules:
  - host: api.my-domain.com
    http:
      paths:
        - backend:
            serviceName: web-backend-service
            servicePort: 80
  - host: app.my-domain.com
    http:
      paths:
        - backend:
            serviceName: web-frontend-service
            servicePort: 80

Here is a guide on how to serve angular 8 application on Minikube using Nginx ingress.