How to establish connection between Angular frontend and Node.js backend in Kubernetes cluster

Frontend
1

I’m running a minikube setup locally with multiple services deployed. My Angular frontend runs in one service while my Node.js backend runs in another service. The backend connects to MongoDB using DNS resolution which works fine for internal services.

The issue I’m facing is getting the frontend to communicate with the backend. When I try to use DNS from the frontend, it can’t resolve the service names. Currently the only solution that works is setting the backend service type to NodePort and manually copying the URL and port to my frontend configuration.

This feels like a hacky approach. Is there a cleaner way to handle service discovery for frontend to backend communication in Kubernetes?

I understand that in production with LoadBalancer type services get external IPs, but even then I need to somehow inject the backend URL into the frontend container.

Here’s my current backend service configuration:

apiVersion: v1
kind: Service
metadata:
  name: api-service
  labels:
    app: my-application
    component: api
spec:
  type: NodePort
  ports:
  - port: 8080
  selector:
    app: my-application
    component: api

When I try using the fully qualified domain name from the client I get:

OPTIONS http://api-service.default.svc.cluster.local:8080/register/ net::ERR_NAME_NOT_RESOLVED
2

Here’s what’s happening: your Angular app runs in the browser, which can’t reach Kubernetes internal DNS because it’s outside the cluster. Your backend talks to MongoDB fine because they’re both inside the cluster.

The fix? Use an Ingress controller to expose your backend with a proper hostname. Set up your Ingress to route requests from a specific path or subdomain to your api-service. Then point your Angular app to this external hostname instead.

For local dev with minikube, just enable the ingress addon and create an Ingress resource for your backend service. This beats using NodePort and actually works like production.

Pro tip: use Angular’s environment files to manage different backend URLs for dev, staging, and prod. No more hardcoded values.

3

Interesting! Are you building your Angular ap at build time or runtime? If it’s built statically, DNS resolution happens in the browser, not inside the cluster - that’s why it can’t resolve internal service names. Have you tried using env vars or a config map to inject the backend URL during deployment? What does your frontend Dockerfile look like?

4

yeah, classic mistake! angular runs in the browser, so it can’t access k8s internal DNS. try using nginx as a reverse proxy for your angular app to handle backend calls, or inject env vars at startup via ConfigMaps. should help a lot!