POST http://xxxx/api/login net::ERR_NAME_NOT_RESOLVED

Hello,
The docker-compose.yml file looks like this:

services:
  front-end:
    container_name: front-end
    build:
      context: /home/project/front-end
      dockerfile: Dockerfile
    ports:
      - "3000:3000"  # Only expose internally, Nginx will handle external access
    environment:
      - NODE_ENV=development
      - REACT_APP_API_URL=http://localhost/api  # Or similar, depending on your frontend framework
      - BUILDKIT_INLINE_CACHE=0
    depends_on:
      - db
      - backend
    networks:
      - app_network

  # PHP-FPM Service
  backend:
    build:
      context: /home/project/portal
      dockerfile: Dockerfile
    container_name: backend
    restart: unless-stopped
    environment:
      APP_ENV: local
      APP_DEBUG: "true"
      DB_HOST: db
      DB_PORT: 3306
      DB_DATABASE: laravel_db
      DB_USERNAME: laravel_user
      DB_PASSWORD: secret
#    volumes:
#      - ./:/var/www
    depends_on:
      - db
    networks:
      - app_network

  # Web Server
  webserver:
    image: nginx:alpine
    container_name: webserver
    restart: unless-stopped
    ports:
      - "80:80"
      - "443:443"
    volumes:
#      - ./:/var/www
      - ./nginx/conf.d:/etc/nginx/conf.d
    networks:
      - app_network
    depends_on:
      - backend
      - front-end
      - db

  # Database
  db:
    image: mariadb:latest
    container_name: db
    restart: unless-stopped
    environment:
      MARIADB_ROOT_PASSWORD: rootsecret
      MARIADB_DATABASE: laravel_db
      MARIADB_USER: laravel_user
      MARIADB_PASSWORD: secret
    volumes:
      - mariadb_data:/var/lib/mysql
      - ./mysql/my.cnf:/etc/mysql/my.cnf
#      - ./file.sql:/docker-entrypoint-initdb.d/file.sql
    ports:
      - "3306:3306"
    networks:
      - app_network


networks:
  app_network:
    driver: bridge

volumes:
  mariadb_data:
    driver: local

And the Nginx configuration file is as follows:

server {
    listen 80;
    server_name _;
    
    location / {
        proxy_pass http://frontend:3000;  # Use service name
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }

    location /api {
        try_files $uri $uri/ /index.php?$query_string;
        fastcgi_pass backend:9000;  # Use service name
        fastcgi_index index.php;
        fastcgi_param SCRIPT_FILENAME /var/www/public$fastcgi_script_name;
        include fastcgi_params;
        fastcgi_param HTTP_HOST $host;
    }
}

I edited the Back-END cors.php file as follows:

 'allowed_origins' => ['http://localhost:3000','http://localhost:3001','http://frontend:3000'],

And I edited the callApi.tsx file for Front-END as follows:

baseURL: 'http://Backend:9000/api',

I went to http://SERVER_IP and when I try to log in to the site with my username and password, I see the following error in the browser console:

POST http://backend:9000/api/login net::ERR_NAME_NOT_RESOLVED      loginForm.tsx:29

Which part of the configuration did I do wrong?

Thank you.

This could be the reason:

Hello,
I changed it to:

REACT_APP_API_URL=http://backend/api

The problem still exists.

Port 9000 is running on IPv6, could this be a problem?

l# docker exec -it backend netstat -tuln |
 grep 9000
tcp6       0      0 :::9000                 :::*                    LISTEN

Hi,
@bluepuma77, I found this. Is my problem with exposing the port?