Kubernetes Ingress 502 Bad Gateway Connection Refused

Question

I'm trying to access my Angular front-end deployed to an AKS cluster at Path / with service lawyerlyui-service. The cluster is using nginx deployed via HELM with the official chart (https://kubernetes.github.io/ingress-nginx) I have other backend .net core services deployed and I can access these via the ingress.

However when i try access the Angular application at https://uat.redactedapp.co.za i get the following error (taken from nginx pod logs)

Below are the configurations and log for nginx, Dockerfile, deployment.yml and ingress.yml

NGINX Log

2021/01/29 20:31:59 [error] 1304#1304: *7634340 connect() failed (111: Connection refused) while connecting to upstream, client: 10.244.0.1,
server: uat.redactedapp.co.za, request: "GET / HTTP/2.0", upstream: "http://10.244.0.88:80/", host: "uat.redactedapp.co.za"

Dockerfile

FROM node:8.12.0-alpine
EXPOSE 80
RUN npm -v

RUN mkdir -p /usr/src

WORKDIR /usr/src

# To handle 'not get uid/gid'
RUN npm config set unsafe-perm true
RUN npm install -g \
    typescript@2.8.3 \
    @angular/compiler-cli \
    @angular-devkit/core

RUN npm install -g @angular/cli@7.0.3

RUN ln -s /usr/src/node_modules/@angular/cli/bin/ng /bin/ng

COPY package.json /usr/src/

RUN npm install

COPY . /usr/src

CMD ["ng", "build", "--configuration", "uat"]

Ingress

apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:
  name: redacted-ingress
  namespace: default
  annotations:
    kubernetes.io/ingress.class: nginx
    nginx.ingress.kubernetes.io/enable-cors: "true"
    nginx.ingress.kubernetes.io/cors-allow-methods: "GET, PUT, POST, DELETE, PATCH, OPTIONS"
    nginx.ingress.kubernetes.io/cors-allow-credentials: "true"
    nginx.ingress.kubernetes.io/proxy-body-size: 50m
    nginx.ingress.kubernetes.io/rewrite-target: /$2
spec:
  tls:
    - hosts:
        - uat.redactedapp.co.za
      secretName: secret-tls
  rules:
    - host: uat.redactedapp.co.za
      http:
        paths:
          - path: /otp-api(/|$)(.*)
            pathType: Prefix
            backend:
              service:
                name: otpapi-service
                port:
                  number: 80
          - path: /search-api(/|$)(.*)
            pathType: Prefix
            backend:
              service:
                name: searchapi-service
                port:
                  number: 80
          - path: /notifications-api(/|$)(.*)
            pathType: Prefix
            backend:
              service:
                name: notificationsapi-service
                port:
                  number: 80
          - path: /user-api(/|$)(.*)
            pathType: Prefix
            backend:
              service:
                name: userapi-service
                port:
                  number: 80
          - path: /insurance-api(/|$)(.*)
            pathType: Prefix
            backend:
              service:
                name: insuranceapi-service
                port:
                  number: 80
          - path: /client-api(/|$)(.*)
            pathType: Prefix
            backend:
              service:
                name: clientsapi-service
                port:
                  number: 80
          - path: /
            pathType: Prefix
            backend:
              service:
                name: lawyerlyui-service
                port:
                  number: 80

Deployment.yml

apiVersion: apps/v1
kind: Deployment
metadata:
  name: lawyerlyui
spec:
  selector:
    matchLabels:
      app: lawyerlyui
  replicas: 1
  template:
    metadata:
      labels:
        app: lawyerlyui
    spec:
      containers:
        - name: lawyerlyui
          image: redacted.azurecr.io/lawyerly:latest
          ports:
            - containerPort: 80
      imagePullSecrets:
        - name: uat-acr-auth
---
apiVersion: v1
kind: Service
metadata:
  name: lawyerlyui-service
spec:
  type: ClusterIP
  selector:
    app: lawyerlyui
  ports:
    - name: http
      protocol: TCP
      # Port accessible inside cluster
      port: 80
      # Port to forward to inside the pod
      targetPort: 80

Answer 1

So after doing so more reading an looking at @mdaniels comments I've created a new Dockerfile.uat. The previous file was only building the src code but never serving it.

As I understand, you need to serve the built Angular code, this is no longer giving me a 502 Bad Gateway.

# Stage 0, "build-stage", based on Node.js, to build and compile the frontend
FROM node:10.8.0 as build-stage
WORKDIR /app
COPY package*.json /app/
RUN npm install
COPY ./ /app/
ARG configuration=uat
EXPOSE 80
RUN npm run build --configuration $configuration

# Stage 1, based on Nginx, to have only the compiled app, ready for production with Nginx
FROM nginx:1.15
#Copy ci-dashboard-dist
COPY --from=build-stage /app/dist/lfa/ /usr/share/nginx/html
#Copy default nginx configuration
COPY ./nginx/nginx-custom.conf /etc/nginx/conf.d/default.conf