Docker networking struggles

Hi guys,

I’ve been scratching my head for a couple of hours here. I have this docker-compose file:

version: "3"

services:
  scraper-api:
    build: ./ATPScraper
    volumes:
      - ./ATPScraper:/usr/src/app
    ports:
      - "5000:80"
    networks:
      - backend
  test-app:
    build: ./test-app
    volumes:
      - "./test-app:/app"
      - "/app/node_modules"
    ports:
      - "3001:3000"
    networks:
      - backend
    environment:
      - NODE_ENV=development
    depends_on:
      - scraper-api

networks:
  backend:

The test-app is a react app that should be able to communicate over a shared network with the flask scraper-api. I’m having trouble doing this.

A little info:

  • As you can see in my compose file, I have attempted to define a shared network, backend between the two services. I am still a newbie, so if I did this wrong, please let me know.
  • The file structure in my local dev environment is:
    parent => [test-app, ATPscraper]
  • scraper-api has an initial endpoint of /api/top_10
  • in my react app, I have been attempting to reach the scraper-api by trying a couple get requests to the url: http://scraper-api:80/api/top_10. Is this correct? Through my scavenging of the docs, I think it is.
  • both apps are running and working independently, but I want the ability to communicate.

Thanks in advance! :slight_smile:

If you start them from the same compose file, they automatically are in the same network. There is no need to create a network manually for such simple cases.
When both containers are up you can open a shell in test-app and manually try to reach scraper-api.

docker-compose exec test-app bash

Or maybe first go to ‘scraper-api’ and check from there if it is actually running.

Thanks for getting back to me! I’ll try out what you recommended. Out of curiosity, based on what you see from my compose file, am I using the correct url?

Okay, so an update. Inside the test-app container I can run curl http://scraper-api:80/api/top_10 and am able to connect to the other service. It just doesn’t work when making get requests within the react app

This means something is wrong inside your react app. You have to debug it. Did you call the app from inside the test-app container already?
Just for curiosity and (probably) not related to your problem: why do you write out defaults like port 80?

So I ended up realizing the problem. The react app is run on the browser and has no idea what “Docker” is on the host. It this has no access to virtual network created by Docker. This was silly, but the problem was my lack of reverse proxy. Adding that to the react app fixed the problem. Thanks for your help guiding me through :slight_smile: