Search code examples
node.jsreactjskubernetesfqdnkubernetes-service

react front-end, node js back-end, monogo db deployment as microservices at kuberenetes minikube


My app is

      React Front-end <------> Nodes js back-end <------> mongodb

Source code can be downloaded from here

You can deploy above ./setup.sh command at minikube kubernetes

1) mongoDB deployment with clusterIP Type service resource

2) Backend node js server with clusterIP Type service resource

3) front-end React build with nginx and LoadBalancer type service resource

Accessing monogdb pod from node js pod using mongodb service FQDN is working fine as mongodb service is cluster IP type and accessing from nodejs pod is working smoothly.

I am having trouble in having communication using axios from react (build) using FQDN of back-end service resource. It is saying:

**POST http://todo-backend-service:5000/init net::ERR_NAME_NOT_RESOLVED**

I have even tried with cluster IP with 5000 port instead of FQDN, not working.

This seems to be a problem after making build or something else?

Solution to it would be appreciated.


Solution

  • So the issue here is that a frontend application makes requests from your browser (it is client-side, not server-side) meaning essentially what you need to do is expose your node.js backend

    Example: if you are using Minikube you could do something as simple: Change your service type for you node.js to type Loadbalancer:

    apiVersion: v1
    kind: Service
    metadata:
      name: todo-backend-service
    spec:
      ports:
      - port: 5000
        targetPort: 5000
      selector:
        app: todo-server-app
      type: LoadBalancer
    

    You would then need to run:

    minikube service todo-backend-service --url
    # OUTPUT
    http://192.168.99.113:30048
    

    This IP address and port is what your frontend should use to connect to the node.js backend:

    curl -X POST http://192.168.99.113:30048/todo/list
    # OUTPUT
    {"error":"Please login first."}
    

    Just a note here, when listing items generally you should use a GET request

    The reasoning behind the example:

    A client-side application loads in your browser, therefore any request made to your backend service will need to be via an external endpoint as your browser will not be on the same network as your Kubernetes Pods