How do I integrate Caddyfile with ASP.NET Core 9 with Angular application?

I have an ASP.NET Core application with Angular. This is how I created my project:

mkdir <solution_name>
cd <solution_name>
dotnet new sln --name <solution_name>
mkdir src
cd src
dotnet new angular -n App
Open <solution_name> soln
right click, create new folder called src
right click on src, add existing project App


CaddyDockerfile

FROM caddy:latest
COPY Caddyfile /etc/caddy/Caddyfile


Caddyfile

{
local_certs
}

app.localhost {
reverse_proxy penaltycancellationformui:5001
}


docker-compose.yml - I manually created the local certificate file, trusted it and saved onto my local machine.

services:
penaltycancellationformui:
image: ttcuipenaltycancellationform:dev
build:
context: . # # Path to the root directory (relative to docker-compose.yml)
dockerfile: Dockerfile # Relative to the build context
networks:
- caddy-net
environment:
- ASPNETCORE_Kestrel__Certificates__Default__Password=mysuperpassword
- ASPNETCORE_Kestrel__Certificates__Default__Path=/https/ttcuipenaltycancellationform.pfx
volumes:
- ${USERPROFILE}/.aspnet/https:/https/
caddy:
image: caddy:dev
build:
context: .
dockerfile: CaddyDockerfile
ports:
- "80:80"
- "443:443"
volumes:
- ./Caddyfile:/etc/caddy/Caddyfile
- caddy_data:/data
networks:
- caddy-net
depends_on:
- penaltycancellationformui
networks:
caddy-net:

volumes:
caddy_data:


Dockerfile

# Stage 1: Build Angular App
FROM mcr.microsoft.com/dotnet/aspnet:9.0 AS base
#do not install node

# Stage 2: Build .NET Application
FROM mcr.microsoft.com/dotnet/sdk:9.0 AS dotnet-build
RUN apt-get update && apt-get install -y nodejs npm
WORKDIR /src
COPY App.csproj .
RUN dotnet restore
COPY . .

# Stage 3: Publish .Net
FROM dotnet-build AS dotnet-publish
RUN dotnet publish -c Release -o /app

# Stage 4: Combine Angular and .NET for Deployment
FROM base AS final
WORKDIR /app
ENV ASPNETCORE_URLS=https://+:5001;http://+:5000
COPY --from=dotnet-publish /app .
ENTRYPOINT ["dotnet", "App.dll"]


When I run docker compose up -d, everything works fine and I can see that containers are created successfully, but app.localhost is not loading anything.

This is the caddy's logs:

{"level":"error","ts":1745422772.0373719,"logger":"http.log.error","msg":"EOF","request":{"remote_ip":"172.23.0.1","remote_port":"54724","client_ip":"172.23.0.1","proto":"HTTP/2.0","method":"GET","host":"app.localhost","uri":"/","headers":{"Sec-Fetch-Mode":["navigate"],"Sec-Fetch-Dest":["document"],"Sec-Ch-Ua":["\"Not(A:Brand\";v=\"99\", \"Google Chrome\";v=\"133\", \"Chromium\";v=\"133\""],"Sec-Fetch-Site":["none"],"Accept-Encoding":["gzip, deflate, br, zstd"],"Accept-Language":["en-US,en;q=0.9"],"Sec-Ch-Ua-Mobile":["?0"],"Sec-Ch-Ua-Platform":["\"Windows\""],"Upgrade-Insecure-Requests":["1"],"Sec-Fetch-User":["?1"],"Priority":["u=0, i"],"Cache-Control":["max-age=0"],"User-Agent":["Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/133.0.0.0 Safari/537.36"],"Accept":["text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7"]},"tls":{"resumed":false,"version":772,"cipher_suite":4865,"proto":"h2","server_name":"app.localhost"}},"duration":0.037247804,"status":502,"err_id":"ahwzwi12f","err_trace":"reverseproxy.statusError (reverseproxy.go:1390)"}


When I run docker compose ps, I can see that the app-penaltycancellationformui-1 container is not exposed to port 5000 and 5001 like I defined.

NAME IMAGE COMMAND SERVICE CREATED STATUS PORTS
app-caddy-1 caddy:dev "caddy run --config …" caddy 6 seconds ago Up 6 seconds 0.0.0.0:80->80/tcp, 0.0.0.0:443->443/tcp, 443/udp, 2019/tcp
app-penaltycancellationformui-1 ttcuipenaltycancellationform:dev "dotnet App.dll" penaltycancellationformui 7 seconds ago Up 6 seconds


I'm not sure what I'm missing. I tried all my options that I can think of, but still have not got the answer yet and I've been struggling for 2 days.

Can anyone please help me ? Thank you

Continue reading...