"The web application can't communicate with the server"

[evhan751]

Describe the bug

Both my client and server pages work, however, after logging in with spotify, I get sent back to the client's /login page.

Additional context

version: "3"

services:
  server:
    container_name: your_spotify_server
    image: yooooomi/your_spotify_server
    restart: always
    ports:
      - "9123:8080" # http://api.music.domain.ca
    links:
      - mongo
    depends_on:
      - mongo
    environment:
      API_ENDPOINT: http://api.music.domain.ca # This MUST be included as a valid URL in the spotify dashboard (see below)
      CLIENT_ENDPOINT: http://music.domain.ca
      SPOTIFY_PUBLIC: 
      SPOTIFY_SECRET: 

  mongo:
    container_name: mongo
    image: mongo:4.4.6
    volumes:
      - ./your_spotify_db:/data/db

  web:
    container_name: your_spotify_client
    image: yooooomi/your_spotify_client
    restart: always
    ports:
      - "3000:3000"
    environment:

  API_ENDPOINT: http://api.music.domain.ca

_your_spotify_client_logs.txt _your_spotify_server_logs.txt

[Yooooomi]

Hello, can you send the chrome logs when accessing the login page?

[evhan751]

Perhaps I have misclicked. Is there a way for me to send this to you privately?

[Yooooomi]

On discord @yooooomi_

[makanimike]

I am dealing with this as well.
I looked at my mongodb logs. and googling the error messages suggest that I might have been on a too old mongo version.
And then I noticed that the docker-compose file for your_spotify is also on v6 . Like OP I was also on a 4.x version.
So, I updated the docker-compose file, and mongodb to v6. But I still get the error.

edit: oh, I just found this... https://github.com/Yooooomi/your_spotify/releases/tag/1.6.0

[evhan751]

I personally can't seem to use mogodb v5/6, with the error

WARNING: MongoDB 5.0+ requires a CPU with AVX support, and your current system does not appear to have that!

which is weird, since I have a Ryzen 7 5700X. Could it be because I'm running docker inside a proxmox virtual machine?

[evhan751]

WARNING: MongoDB 5.0+ requires a CPU with AVX support, and your current system does not appear to have that!

I have fixed this by setting my VM's processor type to "host" in proxmox. I am now running mongoDB 6.0, but I am still getting the same "The web application can't communicate with the server" error.

[evhan751]

Right after starting the your_spotify-server, I get this, a big part seems to be mussing, but I can't find where the this log file is, precisely.

      [Symbol(kEndCalled)]: true,
      [Symbol(kNeedDrain)]: false,
      [Symbol(corked)]: 0,
      [Symbol(kOutHeaders)]: [Object: null prototype] {
        accept: [ 'Accept', 'application/json, text/plain, */*' ],
        'content-type': [ 'Content-Type', 'application/x-www-form-urlencoded' ],
        'user-agent': [ 'User-Agent', 'axios/1.4.0' ],
        'accept-encoding': [ 'Accept-Encoding', 'gzip, compress, deflate, br' ],
        host: [ 'Host', 'accounts.spotify.com' ]
      },
      [Symbol(kUniqueHeaders)]: null
    },
    data: {
      error: 'invalid_grant',
      error_description: 'Invalid authorization code'
    }
  }
}
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
yarn run v1.22.19
$ node ./lib/migrations.js
[info]  Trying to connect to database at mongodb://mongo:27017/your_spotify
[info]  Connected to database !
[info]  Checking database for missing track data...
[info]  Starting migrations
[info]  Migrations successfully ran
Done in 0.36s.

[c0pper]

hi did you solve this issue? I'm facing the same one

[hardball2-0]

Hey,

I have the same error but with mongo 6 any update?

[torohangupta]

Hi- I know this is somewhat old but I had and resolved this issue a bit ago, so I can document how I did that below:

The first big thing is: you MUST use HTTPS. If you don't, modern web browsers block HTTPS pages from HTTP content due to them being "mixed content".

Below is a docker-compose

services:
  server:
    image: yooooomi/your_spotify_server
    container_name: spotify_server
    restart: always
    ports:
      - "[OUTBOUND HOST PORT (SERVER)]:8080" # https://server.domain.com
    links:
      - mongo
    depends_on:
      - mongo
    environment:
      API_ENDPOINT: https://server.domain.com
        # THE API ENDPOINT HAS TO BE A VALID REDIRECT URL IN THE SPOTIFY DEVELOPER DASHBOARD. 
        # https://server.domain.com/oauth/spotify/callback   <- make sure this is in the dashboard (this is the only URL you need in the dashboard)
      CLIENT_ENDPOINT: https://client.domain.com
      SPOTIFY_PUBLIC: # PUBLIC KEY
      SPOTIFY_SECRET: # PRIVATE KEY

  mongo:
    container_name: spotify_db
    image: mongo:6
    volumes:
      - ../your_spotify_db:/data # I'm using a ".." here since i'm using portainer stacks- ymmv for how you want to keep persistent data storage

  web:
    image: yooooomi/your_spotify_client
    container_name: spotify_client
    restart: always
    ports:
      - "[OUTBOUND HOST PORT (CLIENT)]:3000"
    environment:
      API_ENDPOINT: https://server.domain.com

I use a reverse proxy (cloudflared) so after I set the outbound ports on my host machine, I can simply add the ports as normal, and those errors should go away, including the CORS errors.