I’m using an Angular + Java Spring Boot app on an EC2 Instance.

When I open my Frontend the Browser shows:

502 Bad Gateway
nginx

And when I trigger the backend I’m getting this error:

backend | 2024-05-22T20:24:34.836Z INFO 1 — [ main] o.s.b.w.embedded.tomcat.TomcatWebServer : Tomcat started on port 8080 (http) with context path ‘/api’
backend | 2024-05-22T20:24:34.853Z INFO 1 — [ main] com.example.questly.QuestlyApplication : Started QuestlyApplication in 15.958 seconds (process running for 18.632)
backend | 2024-05-22T20:24:35.093Z INFO 1 — [nio-8080-exec-1] o.apache.coyote.http11.Http11Processor : Error parsing HTTP request header
backend | Note: further occurrences of HTTP request parsing errors will be logged at DEBUG level.
backend |
backend | java.lang.IllegalArgumentException: Invalid character found in method name [0x160x030x010x060xf50x010x000x060xf10x030x03C0xc6 ]. HTTP method names must be tokens
backend | at org.apache.coyote.http11.Http11InputBuffer.parseRequestLine(Http11InputBuffer.java:407) ~[tomcat-embed-core-10.1.20.jar!/:na]
backend | at org.apache.coyote.http11.Http11Processor.service(Http11Processor.java:264) ~[tomcat-embed-core-10.1.20.jar!/:na]
backend | at org.apache.coyote.AbstractProcessorLight.process(AbstractProcessorLight.java:63) ~[tomcat-embed-core-10.1.20.jar!/:na]
backend | at org.apache.coyote.AbstractProtocol$ConnectionHandler.process(AbstractProtocol.java:896) ~[tomcat-embed-core-10.1.20.jar!/:na]
backend | at org.apache.tomcat.util.net.NioEndpoint$SocketProcessor.doRun(NioEndpoint.java:1736) ~[tomcat-embed-core-10.1.20.jar!/:na]
backend | at org.apache.tomcat.util.net.SocketProcessorBase.run(SocketProcessorBase.java:52) ~[tomcat-embed-core-10.1.20.jar!/:na]
backend | at org.apache.tomcat.util.threads.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1191) ~[tomcat-embed-core-10.1.20.jar!/:na]
backend | at org.apache.tomcat.util.threads.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:659) ~[tomcat-embed-core-10.1.20.jar!/:na]
backend | at org.apache.tomcat.util.threads.TaskThread$WrappingRunnable.run(TaskThread.java:63) ~[tomcat-embed-core-10.1.20.jar!/:na]
backend | at java.base/java.lang.Thread.run(Thread.java:831) ~[na:na]

My nginx.conf

events {
    worker_connections 1024;
}
http {
    server_tokens off;
    charset utf-8;
    # immer redirect zu https
    server {
        listen 80 default_server;

        server_name domain.xy;

        return 301 https://$host$request_uri;
    }

    server {
        #http2 für verbesserte http Abfragen (Multiplxing, Header-Komprimierung, Server Push, Anfragenprioriesirung)
        listen 443 ssl http2;
        # use the certificates
        ssl_certificate     /etc/letsencrypt/live/domain.xy/fullchain.pem;
        ssl_certificate_key /etc/letsencrypt/live/domain.xy.live/privkey.pem;
        server_name domain.xy;
        root /var/www/html;
        index index.html index.htm;


        # Statische Dateien für das Angular-Frontend
        location / {
            proxy_pass http://frontend:8000/;
            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;
        }

        # Proxy-Pass für das Spring Boot Backend (proxy_set_header sorft fürs beibehalten der Anfrageinformationen)
        location /api/ {
            proxy_pass https://backend:8080/;
            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;
        }

        # SSL-Zertifikate
        location ~ /.well-known/acme-challenge/ {
            root /var/www/certbot;
        }
    }
}

My Backend Dockerfile

FROM gradle:jdk17 AS build
WORKDIR /workspace
COPY . .
RUN gradle bootJar --no-daemon

FROM openjdk:17-alpine
WORKDIR /app
COPY --from=build /workspace/build/libs/*.jar app.jar
CMD ["java", "-jar", "app.jar", "--spring.profiles.active=${SPRING_PROFILE}"]
EXPOSE 8080

My Frontend Dockerfile

# Build Stage
FROM node:20.13.1-alpine as build-stage
RUN npm install -g [email protected]
RUN npm install -g @angular/[email protected]
WORKDIR '/app'
COPY . .
RUN npm install
RUN npm run build

# Production Stage
FROM node:20.13.1-alpine as production-stage
RUN npm install -g serve
WORKDIR /app
COPY --from=build-stage /app/dist/frontend /app
EXPOSE 80
CMD ["serve", "-s", ".", "-l", "80"]

My docker-compose.yml file

services:
  backend:
    container_name: backend
    build: .
    ports:
      - "8080:8080"
    environment:
        - SPRING_PROFILE=prod
        - AWS_REGION=eu-central-1
    networks:
      - app-network

  frontend:
    container_name: frontend
    build: './frontend'
    ports:
      - "8000:80"
    networks:
      - app-network

  nginx:
    image: nginx:latest
    container_name: nginx
    restart: unless-stopped
    ports:
      - "80:80"
      - "443:443"
    volumes:
      - ./nginx.conf:/etc/nginx/nginx.conf
      - ./certbot/conf:/etc/letsencrypt
      - ./certbot/www:/var/www/certbot
    networks:
      - app-network

  certbot:
    container_name: certbot
    image: certbot/certbot
    volumes:
      - ./certbot/conf:/etc/letsencrypt
      - ./certbot/www:/var/www/certbot
    command: certonly --webroot -w /var/www/certbot --force-renewal --email [email protected] -d domain.xy --agree-tos
    networks:
      - app-network
networks:
  app-network:
    driver: bridge