net::ERR_NAME_NOT_RESOLVED docker

Question

I have a very simple docker setup - React WebApp (admin panel) and .netCore Customer API, they connected to bridge network. I am actually creating a health check monitor.

Both containers are connected and I am able to ping via IP and container name without any issues. When I curl the health check endpoint it works fine.

However, when I do a fetch from the same URL from the admin-app react code, its throwing net::ERR_NAME_NOT_RESOLVED docker. Please see the code here:

 async loadData() {
        try {
            fetch('http://customer-api:5000/api/hc')
                .then(function (response) {
                    console.log(response)
                });

        } catch (e) {
            console.log(e);
        }
    }

What I did so far -

• ensured both are in same network
• port is correct
• customer API is accessible from both external browser and container

adminapp docker

# pull official base image
FROM node:13.12.0-alpine

# set working directory
WORKDIR /app

# add `/app/node_modules/.bin` to $PATH
ENV PATH /app/node_modules/.bin:$PATH

# install app dependencies
COPY admin-app/package.json ./
COPY admin-app/package-lock.json ./

RUN npm install --silent
RUN npm install [email protected] -g --silent

# add app
COPY ./admin-app ./

# start app
CMD ["npm", "start"]

customer API docker

    #See https://aka.ms/containerfastmode to understand how Visual Studio uses this Dockerfile to build your images for faster debugging.

FROM mcr.microsoft.com/dotnet/core/aspnet:3.0-buster-slim AS base
WORKDIR /app

ENV WEB_PORT=5000 \
    ASPNETCORE_URLS=http://+:5000 \
    ASPNETCORE_ENVIRONMENT="Local" 

FROM mcr.microsoft.com/dotnet/core/sdk:3.0-buster AS build
WORKDIR /src
COPY ["customerprofile/Figg.Customer.Api/Figg.Customer.Api.csproj", "Figg.Customer.Api/"]
COPY ["core/Figg.Shared/Figg.Shared.csproj", "Figg.Shared/"]
COPY ["core/Figg.Core/Figg.Core.csproj", "Figg.Core/"]
COPY ["customerprofile/Figg.Customer.Domain/Figg.Customer.Domain.csproj", "Figg.Customer.Domain/"]
RUN dotnet restore "Figg.Customer.Api/Figg.Customer.Api.csproj"
COPY . .
WORKDIR "/src/customerprofile/Figg.Customer.Api"
RUN dotnet build "Figg.Customer.Api.csproj" -c Release -o /app/build

FROM build AS publish
RUN dotnet publish "Figg.Customer.Api.csproj" -c Release -o /app/publish

FROM base AS final
WORKDIR /app
COPY --from=publish /app/publish .

EXPOSE $WEB_PORT
ENTRYPOINT ["dotnet", "Figg.Customer.Api.dll"]

Any thoughts?

Ping works:

/app # ping customer-api
PING customer-api (172.21.0.2): 56 data bytes
64 bytes from 172.21.0.2: seq=0 ttl=64 time=0.062 ms
64 bytes from 172.21.0.2: seq=1 ttl=64 time=0.049 ms
64 bytes from 172.21.0.2: seq=2 ttl=64 time=0.068 ms
64 bytes from 172.21.0.2: seq=3 ttl=64 time=0.049 ms
64 bytes from 172.21.0.2: seq=4 ttl=64 time=0.094 ms

---

I found the reason why its not reaching my container - but how to solve this? Please see the pic here, that would explain:

Answer 1

Your Docker Containers are running on your Host (your own system)

Docker published the following ports to the Host:

• 8092 for the ClientAPI (first string in "8092:3000")
• 3000 for the AdminApp. (That is the first 3000 in the "3000:3000" string. That's why I always advise to use different ports to not get confused)

BTW: Where is this 5000 coming from you mentioned? I guess that is the "3000" in the "8092:3000" string. Typo?

The host can reach localhost:3000 (admin-app) and localhost:8092 (ClientAPI).

If one container needs to reach another container, it needs to address the service and the internal port. In your picture: The AdminApp can reach the ClientAPI with customer-api:3000 (or 5000? Typo? :-) )

If you Client-Render the AdminApp, then it needs an address for the ClientAPI in the outside world (outside of the Host). That means reaching the host (your computer running the containers) and that host can put the request through to customer-api:3000.

Conclusion: You need a ProxyServer (Nginx?). Put the Nginx either on the Host (not advisable) or as a separate Container next to the other 2. In the last (and best) option, you give each container an IP address and let Nginx proxy (the verb) request to the right container.

We have this running here on our own environment and Nginx is servicing about 6 different containers. On the Host we have a docker (external) network which passes every request for port 80 and 443 on to the ProxyServer in the Nginx Container. And that Container passes every request (based on the server_name in the Nginx config file) on to the right container.