I’m new to docker, but I’m trying to implement it in my job, here’s the case, I have this angular application "vehicle-management-view" as frontend and this java application as backend "vehicle-management-api" from which my view do http requests. Both applications are already in containers and working fine individually, but the view can’t request to the api no matter what I do, network, ports and all this stuff was configured but it just doesn’t work, I may be forgeting something, here are my dockerfiles, docker compose and my request configurations…
API dockerfile:
FROM openjdk:8-alpine
WORKDIR /opt/docker/vehicle-management
COPY /target/vehicleManagementApi.jar /opt/docker/vehicle-management
ENTRYPOINT java -jar vehicleManagementApi-0.0.1-SNAPSHOT.jar
VIEW dockerfile:
FROM node:alpine as build-stage
WORKDIR /build/vehicle-management-view/
COPY package*.json /build/vehicle-management-view/
RUN npm install
COPY ./ ./
RUN npm run build
# DEPLOY STAGE
FROM nginx:alpine
COPY --from=build-stage build/vehicle-management-view/dist/vehicle-management-view/ /usr/share/nginx/html
Docker Compose:
version: '3'
networks:
vehicle-management-network:
driver: bridge
services:
vehicle-management-api-service:
build:
context: ./vehicleManagementApi
dockerfile: vehicle-management-api.dockerfile
image: cap/vehicle-management-api
container_name: vehicle-management-api
hostname: vehicle-management-api
expose:
- 8081
networks:
- vehicle-management-network
vehicle-management-view-service:
build:
context: ./vehicle-management-view
dockerfile: vehicle-management-view.dockerfile
image: cap/vehicle-management-view
container_name: vehicle-management-view
hostname: vehicle-management-view
depends_on:
- vehicle-management-api-service
ports:
- 4200:80
networks:
- vehicle-management-network
On my view I tried some guesses on the request uri, each one gave me an error:
http://localhost:8081/ -> ERR_CONNECTION_REFUSED
http://vehicle-management-api:8081/ -> ERR_NAME_NOT_RESOLVED
vehicle-management-api:8081/ -> ERR_NAME_NOT_RESOLVED
I think the problem may be my lack of experience, any help is much appreciated!
2
Answers
The requests from your Angular frontend don’t come from the frontend container. They come from the browser that’s running the Angular app.
So you need to map the API port to a host port so it’ll be reachable from the outside.
Map your API port to a host port like this
Now you should be able to reach the API using http://localhost:8081/ as long as you’re running the Angular app in a browser on the host machine and your API is listening on port 8081.
To make things a bit more clear, I’ve rewritten your compose file:
With this docker-compose the API is reachable on http://api:8081/ from the View-application.
Since you have all services in 1 docker-compose, there is no need to create the network.
Just use the default network created
Since you access the API from another Container in the same docker-compose network, there is no need to expose the port of the API.
Exposing ports is only necessary if you want to access that service from the Host (or outside world).
That’s why you do need to expose it on the View container because you probably want to access the View Container from outside the docker-compose network like. It is weird though that you use port 4200 for that. If you would use por 80, then you could have a standard http-webserver on the Host.