Connect Docker Containers: Frontend to GraphQL Backend via Docker Compose on the same Host

Suppose I’m on a host machine with docker-compose running 2 containers/services:

  • backend graphql (ports: 8000:8000)
  • frontend react (ports: 8081:8081)

In the frontend container, where my react + apollo code lives, I need to set this const:

  • Can I alias a subcommand? (shortening the output of `docker ps`)
  • Docker: mounting local directories as a non-root user in a container
  • Docker-compose: Mount a volume only in the first container
  • Cannot change Docker image directory
  • Where are docker images gcloud should build from
  • Is it possible to mount one Path to all container by default?
  • // frontend container code
    export const APOLLO = {
        uri: 'http://0.0.0.0:8000/graphql' // << not working, what to use here?
    };
    

    However, the uri value is not able to connect successfully to the backend graphql endpoint. I’m receiving errors such as Error Network error: request to http://0.0.0.0:8000/graphql failed, reason: connect ECONNREFUSED 0.0.0.0:8000

    The containers work fine on their own. I am able to navigate to http://0.0.0.0:8000, http://0.0.0.0:8000/graphql, http://0.0.0.0:8081 to interact with them individually. I am also able to enter each container and reach the other via their service name-spaces with ping backend or ping frontend.

    However, when I do uri: 'http://backend:8000/graphql' or uri: 'http://backend/graphql' in my code, i get the error Error Network error: only absolute urls are supported.

    On docker inspect backend, I get the backend container’s IP address as: '172.18.0.5'. Which i tried to plug into the uri as uri: 'http://172.18.0.5/graphql', but I get Error Network error: Network request failed with status 403 - "Forbidden"

    How should I connect backend docker container to the frontend within the code given these scenarios?

    Thanks!

  • Huge files in Docker containers
  • Get all containers/images using docker-java client library [closed]
  • Containers can't connect to each other in swarm mode in multi-host environment
  • external access to kubernetes
  • docker build running out of memory, but plenty of memory seems to be available
  • How can I access both ports 8080 and 9990 on bluemix single container for wildfly?
  • One Solution collect form web for “Connect Docker Containers: Frontend to GraphQL Backend via Docker Compose on the same Host”

    Fixed it by running the servers locally instead of Docker and found that backend was rejecting frontend entry due to CORS headers not set. Whitelisted frontends’ ip and it worked. Tested again in Docker containers with the backend ip http://172.18.0.5/graphql and connection was perfect.

    Hope this helps!

    Edit: Referring to the container name in the url hostname i.e. http://backend/graphql also works thanks to the docker network bridge setup by docker compose. This is a better solution than hardcoding the docker container ip above.

    Docker will be the best open platform for developers and sysadmins to build, ship, and run distributed applications.