Basic auth not working in my second docker-compose file for my web app

Question

So I have 2 configurations, the first docker-compose configuration sets up traefik and it has basic auth middleware set up properly and working

But the second I set up basic auth properly and the website runs very well on https and all but the basic authentication doesn't work

Below is the docker-compose file for my website

version: '3.7'

networks:
  traefik-proxy:
    external: true
  internal:
    external: false

services:

  web:
    container_name: web
    build: .
    image: ibl-docs
    command: yarn run serve --build --port ${PORT} --host 0.0.0.0
    volumes:
      - .:/code
      - '/code/node_modules'
    environment:
      - CHOKIDAR_USEPOLLING=true
    expose:
      - ${PORT}
    networks:
      - traefik-proxy
      - internal
    labels:
      - "traefik.enable=true"
      - "traefik.docker.network=traefik-proxy"
      ## HTTP
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}.entrypoints=web"
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}.rule=Host(`${HOST}`)"
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}.service=${TRAEFIK_MANAGER_ID}-secure"
      - "traefik.http.services.${TRAEFIK_MANAGER_ID}.loadbalancer.server.port=${PORT}"

      # Redirect
      - "traefik.http.middlewares.https-redirect.redirectscheme.scheme=https"
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}.middlewares=https-redirect"

      ## HTTPS
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}-secure.entrypoints=websecure"
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}-secure.rule=Host(`${HOST}`)"
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}-secure.tls=${HTTPS_ROUTER_TLS_MODE}"
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}-secure.tls.certresolver=default"
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}-secure.service=${TRAEFIK_MANAGER_ID}-secure"
      - "traefik.http.services.${TRAEFIK_MANAGER_ID}-secure.loadbalancer.server.port=${PORT}"

      ## Admin
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}-admin.rule=Host(`${HOST}`) && PathPrefix(`/admin`)"
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}-admin.entrypoints=websecure"
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}-admin.middlewares=${TRAEFIK_MANAGER_ID}-auth"
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}-admin.tls=${HTTPS_ROUTER_TLS_MODE}"
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}-admin.tls.certresolver=default"
      - "traefik.http.routers.${TRAEFIK_MANAGER_ID}-admin.service=${TRAEFIK_MANAGER_ID}-admin"
      - "traefik.http.services.${TRAEFIK_MANAGER_ID}-admin.loadbalancer.server.port=${PORT}"

      - "traefik.http.middlewares.${TRAEFIK_MANAGER_ID}-auth.basicauth.users=${BASIC_AUTH_USERS}"

the variable BASIC_AUTH_USERS is set in the .env file as username:sdksjdlakjsdlaslkda and the credentials are being generated from .httpaccess

The docker-compose logs for traefik point to no error at all and I have tried ass the credentials within the docker-compose file of my website without the environment variable and escaping the $ twice as suggested by many, but the http auth just doesn't show up.

Any help and suggestions will be much appreciated at this point, thanks.

Answer 1

For me it works like this:

docker-compose.yml

labels:
  [...]
  - "traefik.http.middlewares.auth.basicauth.users=${TRAEFIK_USER}:${TRAEFIK_PASSWORD}"
  [...]

.env

[...]
TRAEFIK_USER=username
TRAEFIK_PASSWORD='$2y$05$xahM2aRLsfQtudl1rimk5OZom7ekdizT911qCAk92tPvathYlZ8B7'
[...]

So replacing the single $ from the hash is not necessary when the variable is substituted.