Teslamate SSL_ERROR_RX_RECORD_TOO_LONG - docker-compose

Question

I'd like to have some security on my Teslamate setup.
I'd like to access it from the web.
I did create a domain name for it and I forwarded ports 3000,4000 to my Synology.
Right now I'm using the IP address locally to simplify the connection.
Currently my - VIRTUAL_HOST=IP Address of Synology.
I'm running it on a Synology NAS in Docker.
I'm trying to use traefik for a proxy
I'm getting an error saying:
SSL_ERROR_RX_RECORD_TOO_LONG
When I go to https://192.168.xxx.xxx:4000/ in my browser. (Synology IP address)
version: "3"
services:
teslamate:
image: teslamate/teslamate:latest
restart: unless-stopped
depends_on:
- db
environment:
- ENCRYPTION_KEY=${TM_ENCRYPTION_KEY}
- DATABASE_USER=${TM_DB_USER}
- DATABASE_PASS=${TM_DB_PASS}
- DATABASE_NAME=${TM_DB_NAME}
- DATABASE_HOST=db
- MQTT_HOST=mosquitto
- VIRTUAL_HOST=${FQDN_TM}
- CHECK_ORIGIN=true
# if you're going to access the UI from another machine replace
# "localhost" with the hostname / IP address of the docker host.
- TZ=${TM_TZ} # (optional) replace to use local time in debug logs. See "Configuration".
labels:
- 'traefik.enable=true'
- 'traefik.port=4000'
- "traefik.http.middlewares.redirect.redirectscheme.scheme=https"
- "traefik.http.middlewares.auth.basicauth.usersfile=/auth/.htpasswd"
- "traefik.http.routers.teslamate-insecure.rule=Host(`${FQDN_TM}`)"
- "traefik.http.routers.teslamate-insecure.middlewares=redirect"
- "traefik.http.routers.teslamate.rule=Host(`${FQDN_TM}`)"
- "traefik.http.routers.teslamate.middlewares=auth"
- "traefik.http.routers.teslamate.entrypoints=websecure"
- "traefik.http.routers.teslamate.tls.certresolver=tmhttpchallenge"
ports:
- 4000:4000
cap_drop:
- all
db:
image: postgres:14
#restart: unless-stopped
environment:
- POSTGRES_USER=${TM_DB_USER}
- POSTGRES_PASSWORD=${TM_DB_PASS}
- POSTGRES_DB=${TM_DB_NAME}
volumes:
- teslamate-db:/var/lib/postgresql/data
grafana:
image: teslamate/grafana:latest
#restart: unless-stopped
environment:
- DATABASE_USER=${TM_DB_USER}
- DATABASE_PASS=${TM_DB_PASS}
- DATABASE_NAME=${TM_DB_NAME}
- DATABASE_HOST=db
- GRAFANA_PASSWD=${GRAFANA_PW}
- GF_SECURITY_ADMIN_USER=${GRAFANA_USER}
- GF_SECURITY_ADMIN_PASSWORD=${GRAFANA_PW}
- GF_AUTH_BASIC_ENABLED=true
- GF_AUTH_ANONYMOUS_ENABLED=false
- GF_SERVER_DOMAIN=${FQDN_TM}
- GF_SERVER_ROOT_URL=https://${FQDN_GRAFANA}
- GF_SERVER_SERVE_FROM_SUB_PATH=true
ports:
- 3000:3000
volumes:
- teslamate-grafana-data:/var/lib/grafana
labels:
- 'traefik.enable=true'
- 'traefik.port=3000'
- "traefik.http.middlewares.redirect.redirectscheme.scheme=https"
- "traefik.http.routers.grafana-insecure.rule=Host(`${FQDN_GRAFANA}`)"
- "traefik.http.routers.grafana-insecure.middlewares=redirect"
- "traefik.http.routers.grafana.rule=Host(`${FQDN_GRAFANA}`)"
- "traefik.http.routers.grafana.entrypoints=websecure"
- "traefik.http.routers.grafana.tls.certresolver=tmhttpchallenge"
mosquitto:
image: eclipse-mosquitto:1.6
#restart: unless-stopped
command: mosquitto -c /mosquitto-no-auth.conf
ports:
- 1883:1883
- 9001:9001
volumes:
- mosquitto-conf:/mosquitto/config
- mosquitto-data:/mosquitto/data
proxy:
image: traefik:v2.7
#restart: unless-stopped
command:
- "--global.sendAnonymousUsage=false"
- "--providers.docker"
- "--providers.docker.exposedByDefault=false"
- "--entrypoints.web.address=:80"
- "--entrypoints.websecure.address=:443"
- "--certificatesresolvers.tmhttpchallenge.acme.httpchallenge=true"
- "--certificatesresolvers.tmhttpchallenge.acme.httpchallenge.entrypoint=web"
- "--certificatesresolvers.tmhttpchallenge.acme.email=${LETSENCRYPT_EMAIL}"
- "--certificatesresolvers.tmhttpchallenge.acme.storage=/etc/acme/acme.json"
#ports:
- 80:80
- 443:443
volumes:
- ./.htpasswd:/auth/.htpasswd
- ./acme/:/etc/acme/
- /var/run/docker.sock:/var/run/docker.sock:ro
volumes:
teslamate-db:
teslamate-grafana-data:
mosquitto-conf:
mosquitto-data: