new to Docker and containers in general. Trying to containerize a simple MERN-based todo list application. Locally on my PC, I can successfully send HTTP post requests from my React frontend to my Nodejs/Express backend and create a new todo item. I use the 'proxy' field in my client folder's package.json file, as shown below:

React starts up on port 3000, my API server starts up on 3001, and with the proxy field defined, all is good locally.

My issue arises when I containerize the three services (i.e. React, API server, and MongoDB). When I try to make the same fetch post request, I receive the following console error:

I will provide the code for my docker-compose file; perhaps it is useful for helping provide me a solution?

version: '3.7'

services:
  client:
    depends_on:
      - server
    build:
      context: ./client
      dockerfile: Dockerfile
    image: jlcomp03/rajant-client
    container_name: container_client
    command: npm start
    volumes:
      - ./client/src/:/usr/app/src
      - ./client/public:/usr/app/public
      # - /usr/app/node_modules
    ports:
      - "3000:3000"
    networks:
      - frontend
    stdin_open: true
    tty: true
  server:
    depends_on:
      - mongo
    build:
      context: ./server
      dockerfile: Dockerfile
    image: jlcomp03/rajant-server
    container_name: container_server
    # command: /usr/src/app/node_modules/.bin/nodemon server.js
    volumes:
      - ./server/src:/usr/app/src
      # - /usr/src/app/node_modules
    ports:
      - "3001:3001"
    links:
      - mongo
    environment:
      - NODE_ENV=development
      - MONGODB_CONNSTRING='mongodb://container_mongodb:27017/todo_db'
    networks:
      - frontend
      - backend
  mongo:
    image: mongo
    restart: always
    container_name: container_mongodb
    volumes:
      - mongo-data:/data/db
    ports:
      - "27017:27017"
    networks:
      - backend

volumes:
  mongo-data:
    driver: local
  node_modules:
  web-root:
    driver: local
    
networks:
  backend:
    driver: bridge
  frontend:

My intuition tells me the issue(s) lies in some configuration parameter I am not addressing in my docker-compose.yml file? Please help!

CodePudding user response：

Your proxy config won't work with containers because of its use of localhost.

The Docker bridge network docs provide some insight why:

Containers on the default bridge network can only access each other by IP addresses, unless you use the --link option, which is considered legacy. On a user-defined bridge network, containers can resolve each other by name or alias.

I'd suggest creating your own bridge network and communicating via container name or alias.

{
  "proxy": "http://container_server:3001"
}

Another option is to use http://host.docker.internal:3001.