I've created a project with React in the front end and Node+express in the back end. I dockerized my frontend and backend, and would like to add traefik so that when I do (in local for now):
localhost:3000/api/products (3000 is the port used in the frontend/client), it redirects to localhost:5000/api/products (5000 is the port used in the backend/server) and then sends back the response to my frontend.
Here is my docker-compose.yml file:
version: "3" services: client: container_name: lgui-client build: context: ./client dockerfile: Dockerfile image: toscalivia83/lgui-client ports: - "3000:3000" volumes: - ./client/src/:/usr/src/app/src/ - ./client:/usr/src/app labels: - "traefik.http.routers.rule=Host:localhost" - "traefik.http.routers.service=server" - "traefik.enable=true" - "traefik.port=8080" stdin_open: true tty: true reverse-proxy: image: traefik:v2.2 command: - --entrypoints.web.address=:80 - --providers.docker=true - --api.insecure ports: - "80:80" - "8080:8080" volumes: - /var/run/docker.sock:/var/run/docker.sock server: container_name: lgui-server build: context: ./server dockerfile: Dockerfile image: toscalivia83/lgui-server ports: - "5000:5000" volumes: - ./server/src/:/usr/src/app/src/ - ./server:/usr/src/app stdin_open: true tty: true
and here is the traefik.toml file that I have created in the root of my project:
# http routing section [http] [http.routers] # Define a connection between requests and services [http.routers.to-server] rule = "Host(`localhost`) && PathPrefix(`/api/`)" service = "lg-server" [http.services] # Define how to reach an existing service on our infrastructure [http.services.lg-server.loadBalancer] [[http.services.lg-server.loadBalancer.servers]] url = "http://localhost:5000/" [docker] endpoint = "unix:///var/run/docker.sock" domain = "localhost" watch = true exposedbydefault = false
In the frontend/client, I have added in the package.json:
When I hit docker-compose up --build, I can open my localhost:3000 correctly. localhost:5000/api/products also returns the right response.
However, localhost:3000/api/products doesn't. It returns my public/index.html!
It worked correctly before I dockerised my application and started using traefik, if I just have in the package.json:
Can someone help me with this please?