How to expose port 3030 in AWS container website?

Hi mparker,

Please go through the below steps i hope it will helps to resolve your issue.

1. Update Dockerfile

Ensure your Dockerfile exposes port 3030:

FROM node:14

WORKDIR /app

COPY package*.json ./

RUN npm install

COPY . .

EXPOSE 3000 3030

CMD ["npm", "start"]

2. Update ECS Task Definition

Make sure your ECS task definition specifies port 3030 in the container definitions:

"containerDefinitions": [
  {
    "name": "your-container-name",
    "image": "your-image",
    "portMappings": [
      {
        "containerPort": 3000,
        "hostPort": 3000
      },
      {
        "containerPort": 3030,
        "hostPort": 3030
      }
    ],
    ...
  }
]

3. Update Security Group

Ensure that the security group associated with your ECS service allows inbound traffic on port 3030:

• Go to the EC2 Console.
• Navigate to Security Groups.
• Select the security group associated with your ECS service.
• Edit the inbound rules to allow traffic on port 3030 (e.g., from 0.0.0.0/0 for testing purposes).

4. Update Application Load Balancer (if used)

If you are using an Application Load Balancer (ALB):

• Go to the EC2 Console.
• Navigate to Load Balancers.
• Select your load balancer.
• Edit the listener to include port 3030.
• Create a target group for port 3030 and register your ECS instances.

5. Adjust Your React App API Requests

Update your React app to make API requests to the correct endpoint. Instead of using localhost:3030, use the public DNS of your ECS instance or the DNS name of your load balancer:

fetch('http://your-ecs-instance-or-load-balancer:3030/api-endpoint')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Error:', error));

Hello,

I think your src/App.js requests localhost:3030 on your computer instead of the EC2 server. If you run src/server/server.js locally, I think it will work.

If you want to expose this api, you should create a reverse proxy in nginx.conf:

worker_processes 1;

events {
  worker_connections 1024;
}

http {
  include mime.types;
  default_type application/octet-stream;

  sendfile on;
  keepalive_timeout 65;

  server {
    listen 80;

    location /internal-api {
        proxy_pass http://localhost:3030/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }

    location / {
      add_header 'Access-Control-Allow-Origin' '*';
      add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
      add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';

      root /usr/share/nginx/html;
      index index.html;
      try_files $uri $uri/ /index.html;
    }
  }
}

And then change http://localhost:3030 in src/App.js to http://example.com/internal-api

Solved, had ot ensure my node-server was running first, I did this my building and running the docker image locally, after making sure it was running on aws, i checked all the port info to make sure it was reachable.