Yooooomi / your_spotify

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

I might be stupid #385

Closed c0pper closed 3 months ago

c0pper commented 3 months ago

Hi, love the app, used to host it for a good while before all of a sudden I couldn't login anymore. Since then, I formatted the raspberry I was using to host it and I'm trying to run this once again. Unfortunately, I'm getting stuck right at the authentication step.

The database and server container are running, but when i open the web interface i receive the "can't communicate with the server" popup.

When i click login, i get redirected to the api endpoint page without anything else happening.

This is my stack:


services:
  server:
    image: yooooomi/your_spotify_server
    restart: always
    ports:
      - "8080:8080"
    links:
      - mongo
    depends_on:
      - mongo
    environment:
      API_ENDPOINT: http://192.168.1.151:8080 # This MUST be included as a valid URL in the spotify dashboard (see below)
      CLIENT_ENDPOINT: http://192.168.1.151:3000
      SPOTIFY_PUBLIC: ****
      SPOTIFY_SECRET: ****
  mongo:
    container_name: mongo
    image: mongo:4.4.8
    volumes:
      - /home/pi/docker/your_spotify_db:/data/db

  web:
    image: yooooomi/your_spotify_client
    restart: always
    ports:
      - "3000:3000"
    environment:
      API_ENDPOINT: http:///192.168.1.151:8080

These are the URIs I have in my spotify app

image

I also added my user in the User management tab of the spotify app.

Any help is appreciated. Thanks!

Yooooomi commented 3 months ago

Hello, can you provide browser logs too? It feels weird, everything looks fine to me. EDIT: and docker logs too

c0pper commented 3 months ago

Hi yes.

Browser console when i open the web interface: image

Console after clicking login:

InstallTrigger is deprecated and will be removed in the future. [constants.js:50:15](moz-extension://e9182098-211b-45ce-b715-d75f2ae2f0bf/constants.js)
Cookie “PHPSESSID” with the “SameSite” attribute value “Lax” or “Strict” was omitted because of a cross-site redirect. [192.168.1.151:3000](http://192.168.1.151:3000/)
Cookie “token” with the “SameSite” attribute value “Lax” or “Strict” was omitted because of a cross-site redirect. [192.168.1.151:3000](http://192.168.1.151:3000/)
Content-Security-Policy: Couldn’t parse invalid host [http:///192.168.1.151:8080/](http://192.168.1.151:8080/) [192.168.1.151:3000](http://192.168.1.151:3000/)
Content-Security-Policy: The page’s settings blocked the loading of a resource at inline (“script-src”). [content-script.js:40:66](moz-extension://e9182098-211b-45ce-b715-d75f2ae2f0bf/content-script.js)
Failed to get subsystem status for purpose 
Object { rejected: true, message: TypeError }
[content-script.js:95:21](moz-extension://e9182098-211b-45ce-b715-d75f2ae2f0bf/content-script.js)
Content-Security-Policy: The page’s settings blocked the loading of a resource at http://192.168.1.151:8080/me (“connect-src”). [xhr.js:258:12](http://192.168.1.151:3000/node_modules/axios/lib/adapters/xhr.js)
Object { stack: "ec@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:402371\nHc</</u.onerror@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:417263\nEventHandlerNonNull*Hc</<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:417240\nHc<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:415690\nGc@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:419765\n_request@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:423727\nrequest@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:422264\nnu.prototype[e]@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:424023\nbl/<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:396910\nuu@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:427285\nme@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:427850\nfd<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:445856\ne/tl</</h<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:394882\ne/tl</<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:395319\nNs/</</<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:389562\ndispatch@http://192.168.1.151:3000/:6:7384\nUf/</<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:476113\nasync*Uf/<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:476135\nol@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:217349\nSc@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:237578\n2627/Ac/<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:234166\nA@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:264279\nM@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:264812\nEventHandlerNonNull*8291@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:264983\nn@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:269680\n4442@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:266756\nn@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:269680\n2627@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:123691\nn@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:269680\n3989@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:253569\nn@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:269680\n9454@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:253285\nn@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:269680\n@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:273252\n@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:1187621\n@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:1187625\n", message: "Network Error", name: "AxiosError", code: "ERR_NETWORK", config: {…}, request: XMLHttpRequest }
[thunk.ts:24:14](http://192.168.1.151:3000/static/js/services/redux/modules/user/thunk.ts)
Content-Security-Policy: The page’s settings blocked the loading of a resource at http://192.168.1.151:8080/global/preferences (“connect-src”). [xhr.js:258:12](http://192.168.1.151:3000/node_modules/axios/lib/adapters/xhr.js)
Object { stack: "ec@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:402371\nHc</</u.onerror@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:417263\nEventHandlerNonNull*Hc</<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:417240\nHc<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:415690\nGc@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:419765\n_request@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:423727\nrequest@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:422264\nnu.prototype[e]@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:424023\nbl/<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:396910\nuu@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:427285\nglobalPreferences@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:427914\nxd<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:447880\ne/tl</</h<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:394882\ne/tl</<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:395319\nNs/</</<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:389562\ndispatch@http://192.168.1.151:3000/:6:7384\nUf/</<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:476127\nasync*Uf/<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:476135\nol@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:217349\nSc@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:237578\n2627/Ac/<@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:234166\nA@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:264279\nM@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:264812\nEventHandlerNonNull*8291@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:264983\nn@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:269680\n4442@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:266756\nn@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:269680\n2627@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:123691\nn@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:269680\n3989@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:253569\nn@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:269680\n9454@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:253285\nn@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:269680\n@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:273252\n@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:1187621\n@http://192.168.1.151:3000/static/js/main.e3d08b6e.js:2:1187625\n", message: "Network Error", name: "AxiosError", code: "ERR_NETWORK", config: {…}, request: XMLHttpRequest }
[thunk.ts:28:14](http://192.168.1.151:3000/static/js/services/redux/modules/settings/thunk.ts)
Content-Security-Policy: The page’s settings blocked the loading of a resource at inline (“script-src”). [content.bundle.js:3:429](moz-extension://68d2221a-d904-4457-86c1-3390539bd81c/content.bundle.js)
Content-Security-Policy: The page’s settings blocked the loading of a resource at inline (“script-src”).

web server docker logs (my current test was at 10:46):

 HTTP  3/29/2024 4:58:38 PM 192.168.1.164 GET /static/js/main.e3d08b6e.js

 HTTP  3/29/2024 4:58:38 PM 192.168.1.164 GET /static/css/main.9493647e.css

 HTTP  3/29/2024 4:58:38 PM 192.168.1.164 Returned 304 in 3 ms

 HTTP  3/29/2024 4:58:38 PM 192.168.1.164 Returned 304 in 4 ms

 HTTP  3/29/2024 4:58:43 PM 192.168.1.164 GET /

 HTTP  3/29/2024 4:58:43 PM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/29/2024 4:58:43 PM 192.168.1.164 GET /variables.js

 HTTP  3/29/2024 4:58:43 PM 192.168.1.164 GET /static/js/main.e3d08b6e.js

 HTTP  3/29/2024 4:58:43 PM 192.168.1.164 GET /static/css/main.9493647e.css

 HTTP  3/29/2024 4:58:43 PM 192.168.1.164 Returned 304 in 4 ms

 HTTP  3/29/2024 4:58:43 PM 192.168.1.164 Returned 304 in 5 ms

 HTTP  3/29/2024 4:58:43 PM 192.168.1.164 Returned 304 in 4 ms

 HTTP  3/29/2024 5:02:00 PM 192.168.1.164 GET /

 HTTP  3/29/2024 5:02:00 PM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/29/2024 5:02:01 PM 192.168.1.164 GET /variables.js

 HTTP  3/29/2024 5:02:01 PM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/29/2024 5:02:01 PM 192.168.1.164 GET /static/js/main.e3d08b6e.js

 HTTP  3/29/2024 5:02:01 PM 192.168.1.164 Returned 304 in 3 ms

 HTTP  3/29/2024 5:02:01 PM 192.168.1.164 GET /static/css/main.9493647e.css

 HTTP  3/29/2024 5:02:01 PM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/29/2024 5:02:01 PM 192.168.1.164 GET /logo192.png

 HTTP  3/29/2024 5:02:01 PM 192.168.1.164 GET /favicon.ico

 HTTP  3/29/2024 5:02:01 PM 192.168.1.164 Returned 200 in 5 ms

 HTTP  3/29/2024 5:02:01 PM 192.168.1.164 Returned 200 in 4 ms

 HTTP  3/29/2024 5:07:23 PM 192.168.1.164 GET /

 HTTP  3/29/2024 5:07:23 PM 192.168.1.164 Returned 200 in 3 ms

 HTTP  3/29/2024 5:07:23 PM 192.168.1.164 GET /variables.js

 HTTP  3/29/2024 5:07:23 PM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/29/2024 5:07:23 PM 192.168.1.164 GET /static/js/main.e3d08b6e.js

 HTTP  3/29/2024 5:07:23 PM 192.168.1.164 Returned 304 in 2 ms

 HTTP  3/29/2024 5:07:23 PM 192.168.1.164 GET /static/css/main.9493647e.css

 HTTP  3/29/2024 5:07:23 PM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/29/2024 5:07:23 PM 192.168.1.164 GET /logo192.png

 HTTP  3/29/2024 5:07:23 PM 192.168.1.164 Returned 200 in 4 ms

 HTTP  3/29/2024 5:07:23 PM 192.168.1.164 GET /favicon.ico

 HTTP  3/29/2024 5:07:23 PM 192.168.1.164 Returned 200 in 3 ms

 HTTP  3/29/2024 5:09:42 PM 192.168.16.1 GET /

 HTTP  3/29/2024 5:09:42 PM 192.168.16.1 Returned 200 in 3 ms

 HTTP  3/29/2024 5:09:43 PM 192.168.16.1 GET /favicon.ico

 HTTP  3/29/2024 5:09:43 PM 192.168.16.1 Returned 200 in 2 ms

 HTTP  3/29/2024 5:56:25 PM 192.168.1.164 GET /login

 HTTP  3/29/2024 5:56:25 PM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/29/2024 5:56:25 PM 192.168.1.164 GET /variables.js

 HTTP  3/29/2024 5:56:25 PM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/29/2024 6:37:44 PM 192.168.1.164 GET /login

 HTTP  3/29/2024 6:37:44 PM 192.168.1.164 Returned 200 in 3 ms

 HTTP  3/29/2024 6:37:44 PM 192.168.1.164 GET /variables.js

 HTTP  3/29/2024 6:37:44 PM 192.168.1.164 Returned 200 in 3 ms

 HTTP  3/29/2024 6:37:44 PM 192.168.1.164 GET /static/js/main.e3d08b6e.js

 HTTP  3/29/2024 6:37:44 PM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/29/2024 6:37:44 PM 192.168.1.164 GET /static/css/main.9493647e.css

 HTTP  3/29/2024 6:37:44 PM 192.168.1.164 Returned 200 in 3 ms

 HTTP  3/29/2024 6:37:44 PM 192.168.1.164 GET /logo192.png

 HTTP  3/29/2024 6:37:44 PM 192.168.1.164 GET /favicon.ico

 HTTP  3/29/2024 6:37:44 PM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/29/2024 6:37:44 PM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/29/2024 7:06:29 PM 192.168.16.1 HEAD /.env

 HTTP  3/29/2024 7:06:29 PM 192.168.16.1 Returned 200 in 4 ms

 HTTP  3/29/2024 7:06:37 PM 192.168.16.1 GET /.env

 HTTP  3/29/2024 7:06:37 PM 192.168.16.1 Returned 200 in 2 ms

 HTTP  3/29/2024 8:12:55 PM 192.168.16.1 GET /

 HTTP  3/29/2024 8:12:55 PM 192.168.16.1 Returned 200 in 3 ms

 HTTP  3/29/2024 9:50:58 PM 192.168.16.1 GET /

 HTTP  3/29/2024 9:50:58 PM 192.168.16.1 Returned 200 in 2 ms

 HTTP  3/29/2024 9:52:52 PM 192.168.16.1 GET /favicon.ico

 HTTP  3/29/2024 9:52:52 PM 192.168.16.1 Returned 200 in 5 ms

 HTTP  3/30/2024 7:55:34 AM 192.168.16.1 GET /

 HTTP  3/30/2024 7:55:34 AM 192.168.16.1 Returned 200 in 4 ms

 HTTP  3/30/2024 7:55:35 AM 192.168.16.1 GET /favicon.ico

 HTTP  3/30/2024 7:55:35 AM 192.168.16.1 Returned 200 in 3 ms

 HTTP  3/30/2024 10:46:11 AM 192.168.1.164 GET /

 HTTP  3/30/2024 10:46:11 AM 192.168.1.164 Returned 200 in 3 ms

 HTTP  3/30/2024 10:46:12 AM 192.168.1.164 GET /variables.js

 HTTP  3/30/2024 10:46:12 AM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/30/2024 10:46:12 AM 192.168.1.164 GET /static/css/main.9493647e.css

 HTTP  3/30/2024 10:46:12 AM 192.168.1.164 Returned 200 in 1 ms

 HTTP  3/30/2024 10:46:12 AM 192.168.1.164 GET /static/js/main.e3d08b6e.js

 HTTP  3/30/2024 10:46:12 AM 192.168.1.164 Returned 304 in 2 ms

 HTTP  3/30/2024 10:46:12 AM 192.168.1.164 GET /logo192.png

 HTTP  3/30/2024 10:46:12 AM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/30/2024 10:46:12 AM 192.168.1.164 GET /favicon.ico

 HTTP  3/30/2024 10:46:12 AM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/30/2024 10:46:15 AM 192.168.1.164 GET /static/css/main.9493647e.css.map

 HTTP  3/30/2024 10:46:15 AM 192.168.1.164 GET /static/js/main.e3d08b6e.js.map

 HTTP  3/30/2024 10:46:15 AM 192.168.1.164 Returned 200 in 7 ms

 HTTP  3/30/2024 10:46:15 AM 192.168.1.164 Returned 200 in 139 ms

 HTTP  3/30/2024 10:47:56 AM 192.168.1.164 GET /

 HTTP  3/30/2024 10:47:56 AM 192.168.1.164 Returned 304 in 3 ms

 HTTP  3/30/2024 10:47:57 AM 192.168.1.164 GET /variables.js

 HTTP  3/30/2024 10:47:57 AM 192.168.1.164 Returned 304 in 2 ms

 HTTP  3/30/2024 10:47:57 AM 192.168.1.164 GET /static/css/main.9493647e.css

 HTTP  3/30/2024 10:47:57 AM 192.168.1.164 Returned 304 in 2 ms

 HTTP  3/30/2024 10:47:57 AM 192.168.1.164 GET /static/js/main.e3d08b6e.js

 HTTP  3/30/2024 10:47:57 AM 192.168.1.164 Returned 304 in 2 ms

 HTTP  3/30/2024 10:47:57 AM 192.168.1.164 GET /logo192.png

 HTTP  3/30/2024 10:47:57 AM 192.168.1.164 Returned 200 in 2 ms

 HTTP  3/30/2024 10:47:57 AM 192.168.1.164 GET /favicon.ico

 HTTP  3/30/2024 10:47:57 AM 192.168.1.164 Returned 200 in 3 ms

 HTTP  3/30/2024 10:47:57 AM 192.168.1.164 GET /static/js/main.e3d08b6e.js.map

 HTTP  3/30/2024 10:47:57 AM 192.168.1.164 Returned 304 in 2 ms

Docker server logs:

[info]  [93Simonster]: no new music

[info]  [DbLoop] starting for 1 users

[info]  [93Simonster]: refreshing...

[info]  [93Simonster]: no new music

[info]  [DbLoop] starting for 1 users

[info]  [93Simonster]: refreshing...

[info]  [93Simonster]: no new music

[info]  [DbLoop] starting for 1 users

[info]  [93Simonster]: refreshing...

[info]  [93Simonster]: no new music

GET /oauth/spotify 302 19.983 ms - 808

GET /oauth/spotify/callback?code=[REDACTED] 302 303.479 ms - 94

[info]  [DbLoop] starting for 1 users

[info]  [93Simonster]: refreshing...

[info]  [93Simonster]: no new music

[info]  [DbLoop] starting for 1 users

[info]  [93Simonster]: refreshing...

[info]  [93Simonster]: no new music

Thank you for your assistance and keep up the great work

RagingCactus commented 3 months ago
Content-Security-Policy: Couldn’t parse invalid host [http:///192.168.1.151:8080/](http://192.168.1.151:8080/) [192.168.1.151:3000](http://192.168.1.151:3000/)

API_ENDPOINT: http:///192.168.1.151:8080

Your API_ENDPOINT has three slashes after http:, which is why the frontend is not loading properly. Try fixing that, and if more issues come up, provide the new logs again please.

c0pper commented 3 months ago

Many thanks! That was it. Don't hate me but i have a follow-up question: if I want to expose this to the internet on a domain I have, such as "https://yourspotify.*****.****.org", what would be the correct way of doing so?

I tried changing the client endpoint in the following:

version: "3"

services:
  server:
    image: yooooomi/your_spotify_server
    restart: always
    ports:
      - "8080:8080"
    links:
      - mongo
    depends_on:
      - mongo
    environment:
      API_ENDPOINT: http://192.168.1.151:8080 # This MUST be included as a valid URL in the spotify dashboard (see below)
      CLIENT_ENDPOINT: https://yourspotify.*****.****.org # http://192.168.1.151:3000
      SPOTIFY_PUBLIC: *******
      SPOTIFY_SECRET: ********
  mongo:
    container_name: mongo
    image: mongo:4.4.8
    volumes:
      - /home/pi/docker/your_spotify_db:/data/db

  web:
    image: yooooomi/your_spotify_client
    restart: always
    ports:
      - "3000:3000"
    environment:
      API_ENDPOINT: http://192.168.1.151:8080

The result is this console output when i go to the domain, before even logging in:

Failed to get subsystem status for purpose 
Object { rejected: true, message: TypeError }
​
message: TypeError: port is undefined
​​
columnNumber: 9
​​
fileName: "moz-extension://e9182098-211b-45ce-b715-d75f2ae2f0bf/extension-utils.js"
​​
lineNumber: 66
​​
message: "port is undefined"
​​
stack: "sendPortMessageWithReply/<@moz-extension://e9182098-211b-45ce-b715-d75f2ae2f0bf/extension-utils.js:66:9\nsendPortMessageWithReply@moz-extension://e9182098-211b-45ce-b715-d75f2ae2f0bf/extension-utils.js:56:12\n@moz-extension://e9182098-211b-45ce-b715-d75f2ae2f0bf/extension.js:247:12\n@moz-extension://e9182098-211b-45ce-b715-d75f2ae2f0bf/extension-utils.js:124:57\n"
​​
<prototype>: TypeError.prototype { stack: "", … }
​
rejected: true
​
<prototype>: Object { … }
[content-script.js:95:21](moz-extension://e9182098-211b-45ce-b715-d75f2ae2f0bf/content-script.js)
Blocked loading mixed active content “http://192.168.1.151:8080/me”
[xhr.js:258:12](https://yourspotify.simoon.duckdns.org/node_modules/axios/lib/adapters/xhr.js)
Object { stack: "ec@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:402371\nHc</</u.onerror@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:417263\nEventHandlerNonNull*Hc</<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:417240\nHc<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:415690\nGc@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:419765\n_request@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:423727\nrequest@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:422264\nnu.prototype[e]@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:424023\nbl/<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:396910\nuu@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:427285\nme@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:427850\nfd<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:445856\ne/tl</</h<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:394882\ne/tl</<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:395319\nNs/</</<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:389562\ndispatch@https://yourspotify.simoon.duckdns.org/:6:7384\nUf/</<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:476113\nasync*Uf/<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:476135\nol@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:217349\nSc@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:237578\n2627/Ac/<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:234166\nA@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:264279\nM@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:264812\nEventHandlerNonNull*8291@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:264983\nn@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:269680\n4442@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:266756\nn@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:269680\n2627@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:123691\nn@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:269680\n3989@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:253569\nn@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:269680\n9454@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:253285\nn@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:269680\n@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:273252\n@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:1187621\n@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:1187625\n", message: "Network Error", name: "AxiosError", code: "ERR_NETWORK", config: {…}, request: XMLHttpRequest }
[thunk.ts:24:14](https://yourspotify.simoon.duckdns.org/static/js/services/redux/modules/user/thunk.ts)
Blocked loading mixed active content “http://192.168.1.151:8080/global/preferences”
[xhr.js:258:12](https://yourspotify.simoon.duckdns.org/node_modules/axios/lib/adapters/xhr.js)
Object { stack: "ec@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:402371\nHc</</u.onerror@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:417263\nEventHandlerNonNull*Hc</<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:417240\nHc<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:415690\nGc@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:419765\n_request@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:423727\nrequest@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:422264\nnu.prototype[e]@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:424023\nbl/<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:396910\nuu@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:427285\nglobalPreferences@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:427914\nxd<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:447880\ne/tl</</h<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:394882\ne/tl</<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:395319\nNs/</</<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:389562\ndispatch@https://yourspotify.simoon.duckdns.org/:6:7384\nUf/</<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:476127\nasync*Uf/<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:476135\nol@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:217349\nSc@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:237578\n2627/Ac/<@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:234166\nA@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:264279\nM@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:264812\nEventHandlerNonNull*8291@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:264983\nn@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:269680\n4442@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:266756\nn@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:269680\n2627@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:123691\nn@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:269680\n3989@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:253569\nn@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:269680\n9454@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:253285\nn@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:269680\n@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:273252\n@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:1187621\n@https://yourspotify.simoon.duckdns.org/static/js/main.e3d08b6e.js:2:1187625\n", message: "Network Error", name: "AxiosError", code: "ERR_NETWORK", config: {…}, request: XMLHttpRequest }
[thunk.ts:28:14](https://yourspotify.simoon.duckdns.org/static/js/services/redux/modules/settings/thunk.ts)
Content-Security-Policy: The page’s settings blocked the loading of a resource at inline (“script-src”). [content.bundle.js:3:429](moz-extension://68d2221a-d904-4457-86c1-3390539bd81c/content.bundle.js)
Content-Security-Policy: The page’s settings blocked the loading of a resource at inline (“script-src”).

Could you please indicate the correct way of doing this? Thanks again

RagingCactus commented 3 months ago

In that case you must update both your API_ENDPOINT and your CLIENT_ENDPOINT to use your domain name, so both backend and frontend are accessed using that domain name. Deploying them on different domains (i.e. with them being cross-site) will not work in most browser, no matter what settings you use.

c0pper commented 3 months ago

Ok so i replaced the internal ip in the 2 api endpoints and client endpoint variables and not i have this

version: "3"

services:
  server:
    image: yooooomi/your_spotify_server
    restart: always
    ports:
      - "8080:8080"
    links:
      - mongo
    depends_on:
      - mongo
    environment:
      API_ENDPOINT: https://yourspotify.***.***.org# This MUST be included as a valid URL in the spotify dashboard (see below)
      CLIENT_ENDPOINT: https://yourspotify.***.***.org# http://192.168.1.151:3000
      SPOTIFY_PUBLIC: b6bfccb3bdfe4841a1d4715fb1bac93e
      SPOTIFY_SECRET: e5f6cb980fac40f6891c4cd2a9614469
  mongo:
    container_name: mongo
    image: mongo:4.4.8
    volumes:
      - /home/pi/docker/your_spotify_db:/data/db

  web:
    image: yooooomi/your_spotify_client
    restart: always
    ports:
      - "3000:3000"
    environment:
      API_ENDPOINT: https://yourspotify.***.***.org

When opening the web interface i get this:

image

and when i click login:

image

These are my uris image

Let me know if you need anything else. Thanks

RagingCactus commented 3 months ago

Regarding the errors in the console: Can you try disabling your browser extensions and test again? It looks like the errors in the console are caused by an extension trying to do something it isn't allowed to do. I don't think they are the cause of your issues, but just to reduce the errors.

It also looks like you might have forgotten to add the correct port for the backend, as it seems like you are still looking at the frontend webserver even though /oauth/spotify is only a valid route in the backend. Alternatively, you can also use a different subdomain for the backend if you also want it to be on port 443, such as https://yourspotify-backend.***.***.org. Just make sure frontend and backend are same-site, i.e. they share the same "TLD+1" and scheme as described on https://web.dev/articles/same-site-same-origin#site

c0pper commented 3 months ago

That did the trick! The issue was that the 2 (same) domains in the api and client endpoint all pointed towards the same internal ip and port. What I did to solve this was using another domain for the endpoint (spotyauth) and point that domain to my internal ip and 8080 port, similar to the official documentation. And then it allowed me to log in.

Thanks and happy Easter!