0

I have two separate docker files, one for running nextjs on nginx web server and another for running Laravel on another nginx:

    services:

  frontendx:
    container_name: next_appx
    build:
      context: ./frontend
      dockerfile: Dockerfile
    restart: unless-stopped
    volumes:
      - ./frontend:/var/www/html/frontend
    networks:
      - app

      
  nginxy:
    container_name: nginxy
    image: nginx:1.19-alpine
    restart: unless-stopped
    ports:
      - '8080:80'
    volumes:
      - ./frontend:/var/www/html/frontend
      - ./nginx/nginx.conf:/etc/nginx/conf.d/default.conf
    depends_on:
      - frontendx
    networks:
      - app

and:

services:
  backendx:
    container_name: laravelx
    build:
      context: .
      dockerfile: Dockerfile
    restart: unless-stopped
    ports:
      - '8000:8000'
    volumes:
      - ./:/var/www
      - enlive-vendor:/var/www/vendor
      - .//docker-xdebug.ini:/usr/local/etc/php/conf.d/docker-php-ext-xdebug.ini
    depends_on:
      - dbx
    networks:
      - appx

  webserverx:
    image: nginx:alpine
    container_name: webserverx
    restart: unless-stopped
    tty: true
    ports:
      - "8090:80"
      - "443:443"
    volumes:
      - ./:/var/www
      - ./nginx/conf.d/:/etc/nginx/conf.d/
    networks:
      - appx

I can connect to the backend container through axios and address like : http://localhost:8090/api/my/api/address

but when I try to get data through getStaticProps I've got the ECONNREFUSED connection error:

  const res = await fetch(`http://localhost:8090/api/address`)

I tried to replace the localhost with container ip address like : 172.20.0.2 but I've got the 504 Gateway error.

rahman j89
  • 59
  • 8

1 Answers1

1

That's expected.

With axios, you're calling from the browser which is making the request from your host machine network.

But getStaticProps being a SSR function, is run inside your nextjs container. Therefore it must be able to find your backend in your app network.

Now by your setup, the frontend and backend apps are in different isolated networks and you can't connect them like this. But if you put them all your services in the same network, lets say your app(instead of appx) network, you can easily use docker dns:

  const res = await fetch(`http://webserverx/api/address`)

Docker knows how to resolve webserverx to your webserverx container.

Mostafa Bahri
  • 2,303
  • 2
  • 19
  • 26
  • I still get "getaddrinfo EAI_AGAIN webserverx" error when use webserverx as a destination host name. – rahman j89 Aug 20 '22 at 17:03
  • @rahmanj89 did you put all your containers in the same network? – Mostafa Bahri Aug 20 '22 at 17:58
  • I tried two ways: first I inserted all containers in one docker-compose file with same network but I got "connect ECONNREFUSED" error. then I separate backend and frontend in two different files with different networks and this time I got the error described in the question. Could I run two different containers in two different docker-compose file with the same network? – rahman j89 Aug 20 '22 at 18:19
  • Yes you can. You need to use external networks https://stackoverflow.com/questions/38088279/communication-between-multiple-docker-compose-projects – Mostafa Bahri Aug 20 '22 at 18:22
  • @rahmanj89 Glad it worked out! – Mostafa Bahri Aug 21 '22 at 08:23