Why a angular container needs a exposed port to connect?

问题

this is just a question about theory, my app is running perfectly...

So, I have 3 services runing with docker-compose: a postgres database, a backend springboot and a frontend angular.

From what I know, docker containers can acess ports from other docker containers without the need to expose the port, so there is no need to expose nor bind the ports because they are all containers and can access each other with the default bridge network mode (that's what I learned, don't know if this is right).

I only need to expose the port from the frontend container so I can access from my localhost.

The thing is: I can access the database with the backend (backend -> database) without the need of exporting any ports, but with the frontend (frontend -> backend) using angular with nginx, it only works with the backend port exposed, why?

docker-compose.yml:

version: "3"
services:
  ### DATABASE ###
  db:
    image: postgres:latest
    container_name: mydb
    network_mode: bridge
    environment:
      - POSTGRES_PASSWORD=envpass
      - POSTGRES_USER=envuser
      - POSTGRES_DB=database

    # It works without exposing
    # expose: 
      # - 5432
    # ports:
      # - 5433:5432

  ### BACKEND ###
  backend:
    image: angularback
    container_name: backend
    network_mode: bridge
    expose:
      - 8080
    ports:
      - 8082:8080
    depends_on:
      - db
    links:
      - db

  ### FRONTEND ###
  frontend:
    image: angularfront
    container_name: frontend
    network_mode: bridge
    expose:
      - 80
    ports:
      - 8084:80
    depends_on:
      - backend
    links:
      - backend

回答1:

You Angular frontend is making requests to the Spring backend from outside the frontend container. It's making request from inside your browser. That's why the backend also needs to be exposed.

Second, you don't need links. The linking will be done automatically since both services are in the same network.

Here is a updated config, that uses networks instead:

version: "3"
services:
  ### DATABASE ###
  db:
    image: postgres:latest
    environment:
      - POSTGRES_PASSWORD=envpass
      - POSTGRES_USER=envuser
      - POSTGRES_DB=database
    # Only add the ports here, if you want to access the database using an external client.
    # ports:
      # - "5433:5432"
    networks:
      - backend


  ### BACKEND ###
  backend:
    image: angularback
    ports:
      - "8082:8080"
    depends_on:
      - db
    networks:
      - backend
      - frontend


  ### FRONTEND ###
  frontend:
    image: angularfront
    ports:
      - "8084:80"
    depends_on:
      - backend
    networks:
      - frontend

networks:
  backend:
  frontend:

When not running in production, I'd also recommend to bind the ports all directly to the host interface (127.0.0.1), to prevent others in your network to access the port on your machine, like this:

ports:
  - "127.0.0.1:8084:80"

来源：https://stackoverflow.com/questions/60823166/why-a-angular-container-needs-a-exposed-port-to-connect