Yooooomi / your_spotify

Self hosted Spotify tracking dashboard
GNU General Public License v3.0
3.02k stars 122 forks source link

Traefik CORS: invalid certificate #131

Open washichi opened 2 years ago

washichi commented 2 years ago

I've been using your_spotify in local mode and I'm very happy with it, with the new friends affinity feature I wanted to host this behind my traefik reverse proxy but I can't reach my spotify_server.domain.com.

I can access my client (spotify.domain.com) when I try to login I get redirected to https://spotify_server.domain.com/oauth/spotify Which doesn't show because of the error:

Chrome: NET::ERR_CERT_AUTHORITY_INVALID Firefox:spotify_server.domain.com uses an invalid security certificate. The certificate is not trusted because it is self-signed. Error code: MOZILLA_PKIX_ERROR_SELF_SIGNED_CERT (my PEM chain consists of 1 BEGIN/END certificate section)

My docker-compose.yml:

version: "3"

services:
  your_spotify_server:
    image: yooooomi/your_spotify_server
    container_name: your_spotify_server
    restart: always
    ports:
      - "8087:8080"
    links:
      - your_spotify_db
    depends_on:
      - your_spotify_db
    environment:
      - API_ENDPOINT=https://spotify_server.domain.com 
      - CLIENT_ENDPOINT=https://spotify.domain.com
      - SPOTIFY_PUBLIC=xxxxxxxxxxxxxxxxxxxxxxx
      - SPOTIFY_SECRET=xxxxxxxxxxxxxxxxxxxxxxxxxx
      - CORS=all
      - MONGO_ENDPOINT=mongodb://your_spotify_db:27017/your_spotify
      - TIMEZONE=Europe/Amsterdam # Only affects read requests, write are in UTC time
    labels:
      - "traefik.enable=true" # <== Enable traefik to proxy this container
      - "traefik.http.routers.spotify_server-web.rule=Host(`spotify_server.domain.com`)" 
      - "traefik.http.routers.spotify_server-web.entrypoints=web" 
      - "traefik.http.routers.spotify_server-web.middlewares=redirect@file" 
      - "traefik.http.routers.spotify_server-secured.rule=Host(`spotify_server.domain.com`)" 
      - "traefik.http.routers.spotify_server-secured.entrypoints=web-secured" 
      - "traefik.http.routers.spotify_server-secured.tls.certresolver=mytlschallenge" 
      # CORS header
      - "traefik.http.middlewares.spotiauth-cors.headers.accesscontrolallowmethods=GET,POST,PUT,DELETE"
      - "traefik.http.middlewares.spotiauth-cors.headers.accesscontrolalloworiginlist=https://spotify.domain.com"
      - "traefik.http.middlewares.spotiauth-cors.headers.accesscontrolallowcredentials=true"
      - "traefik.http.middlewares.spotiauth-cors.headers.accesscontrolmaxage=100"
      - "traefik.http.middlewares.spotiauth-cors.headers.addvaryheader=true"
      - "traefik.http.middlewares.spotiauth-cors.headers.accessControlAllowHeaders=Content-Type"
      - "traefik.http.routers.spotiauth.middlewares=spotiauth-cors"
    networks:
      - web
      - backend

  your_spotify_client:
    image: yooooomi/your_spotify_client
    container_name: your_spotify_client
    restart: unless-stopped
    ports:
      - "3000:3000"
    environment:
      - API_ENDPOINT=https://spotify_server.domain.com
    labels:
      - "traefik.enable=true" # <== Enable traefik to proxy this container
      - "traefik.http.routers.spotify_client-web.rule=Host(`spotify.domain.com`)" 
      - "traefik.http.routers.spotify_client-web.entrypoints=web"
      - "traefik.http.routers.spotify_client-web.middlewares=redirect@file" 
      - "traefik.http.routers.spotify_client-secured.rule=Host(`spotify.domain.com`)"
      - "traefik.http.routers.spotify_client-secured.entrypoints=web-secured"
      - "traefik.http.routers.spotify_client-secured.tls.certresolver=mytlschallenge"
    networks:
      - web
      - backend

  your_spotify_db:
    container_name: your_spotify_db
    image: mongo:4.4
    volumes:
      - ~/docker/your_spotify/db:/data/db
    networks:
      - backend
    restart: unless-stopped

networks:
  web:
    external: true
  backend:
    external: false

-web and -secured I redirect my http traffic to https, and use 'mytlschallenge' as certificate resolver, this is all done using traefik (works without issues on other containers), with the -web and -secured routers (and they are working correctly accordingly Traefik dashboard). My containers don't log any fault, communication with mangodb is logged as succesfull. My spotify dashboard has the URI 'https://spotify_server.domain.com/oauth/spotify/callback'

I think my problem is with CORS. Is there anyone who has this working behind traefik and knows what I'm doing wrong?

EDIT: removing 'https://' from my *_ENDPOINT does make a difference: spotify.domain.com is loaded without NET::ERR_CERT_AUTHORITY_INVALID but after pressing 'login' i'm redirected to 'https://spotify.domain.com/spotify_server.domain.com/oauth/spotify' so it seems that the prefix is required.

CaptaiNiveau commented 2 years ago

I haven't tried Traefik yet, however it's working for me on https://spotify.domain.com with the swag container (nginx and a few other things). Look at the latest issue I've posted, I've included my configuration there. If I have some spare time, I'll try to set this up using Traefik. It does look very cool :D

Yooooomi commented 2 years ago

Hello there!

It would be very helpful if I could see the issue happening from my device or with screenshots of yours. If firefox tells you it's a self signed certificate then either you generated the certificate and it does not come from a trusted certificate authority or your OS is not up to date.

washichi commented 2 years ago

My spotify client is accessible at spotify.homespot.dev , my server at spotify_server.homespot.dev I tested with chrome and firefox, both tell me it's a problem with the certificate signing. When I check the SSL certificate of spotify_server.homespot.dev it is a default traefik certificate (which is problematic).

Chrome output when loading spotify.homespot.dev/login: Untitled

I'm now reading up on CORS & Traefik, cause I think the problem is there. but it's hard to grasp it all.