Failed to connect to mpd

Question

Failed to connect to mpd

brunakov opened this issue 4 years ago · comments

Hi there !
I am really interested on trying your project, however once I point my browser to the webpage of my mpd server, I am getting : Failed to connect to MPD after 3 attempts. Please reload the page to try again.

The server output is : ws2mpd attached to a http server { address: '::', family: 'IPv6', port: 3399 } (Why IPv6 though ..)
Bear in mind that cyp and mpd run on the same remote server, and I am trying to reach cyp through a different computer.

Ondřej Žára · Answer 1 · Thu Sep 03 2020 14:01:26 GMT+0800 (China Standard Time)

Hi @atomtm,

please edit the very last line of index.js in your CYP directory, to enable logging:

require("ws2mpd").logging(true);

...then restart CYP and check its output. It should describe the problem in more detail.

borisrunakov · Answer 2 · Thu Sep 03 2020 18:55:13 GMT+0800 (China Standard Time)

Tried that, however the output is still the same, i.e. : ws2mpd attached to a http server { address: '::', family: 'IPv6', port: 3399 }
I forgot to mention that I am using nginx as reverse proxy to redirect https to http.
The output when I am directing my browser to CYP is :

Is there a way I can hardcode the address:port of the mpd server to localhost:6600 somewhere ?

Ondřej Žára · Answer 3 · Thu Sep 03 2020 20:37:00 GMT+0800 (China Standard Time)

I forgot to mention that I am using nginx as reverse proxy to redirect https to http.

The JS app uses WebSocket protocol to connect to CYP. Perhaps nginx is having issues here? Can you try running your setup without nginx to see if the situation improves?

Is there a way I can hardcode the address:port of the mpd server to localhost:6600 somewhere ?

That already seems to be the default value. You can change it by passing it as a query string parameter: http://localhost:8080/?server=localhost:6655

borisrunakov · Answer 4 · Thu Sep 03 2020 20:50:47 GMT+0800 (China Standard Time)

You are correct ! Nginx was the problem, however I would like to have it configured like so , so that I don't need to open an extra port on my firewall.
Any idea?

Ondřej Žára · Answer 5 · Thu Sep 03 2020 20:58:11 GMT+0800 (China Standard Time)

I would like to have it configured like so , so that I don't need to open an extra port on my firewall.

So, what should the setup look like?

Typically:

mpd runs on host1:port1 (default = localhost:6600)
cyp/ws2mpd runs on host2:port2 (default = localhost:8080)

The web app then tries to

make GET and POST requests to http://host2:port2
make a WebSocket connection to ws://host2:port2

What values of {host,port}{1,2} do you want? Apparently nginx is able to proxy WebSocket traffic as well: https://www.serverlab.ca/tutorials/linux/web-servers-linux/how-to-configure-nginx-for-websockets/

borisrunakov · Answer 6 · Thu Sep 03 2020 21:03:29 GMT+0800 (China Standard Time)

Host should be localhost , and port should be say 3378.
At the moment I am using the following configuration:

server {
    listen 443 ssl;
    listen [::]:443 ssl;
    server_name my_domain.com;

    ssl_certificate /etc/letsencrypt/live/my_domain.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/my_domain.com/privkey.pem;



    location / {
        proxy_pass http://127.0.0.1:3378;
        proxy_set_header X-Forwarded-For $remote_addr;
    }
}

Ondřej Žára · Answer 7 · Thu Sep 03 2020 21:08:14 GMT+0800 (China Standard Time)

At the moment I am using the following configuration:

My nginx experience is very low, so I am unable to really comment on this. Can you see the requests made by the browser? Is the POST /ticket successful? Is it followed by a (failing) WebSocket GET /?ticket=... upgrade request?

borisrunakov · Answer 8 · Thu Sep 03 2020 21:12:40 GMT+0800 (China Standard Time)

Let me further investigate in the evening (around 5 hours from now) and I will post back my findings.

borisrunakov · Answer 9 · Fri Sep 04 2020 04:17:12 GMT+0800 (China Standard Time)

At the moment I am using the following configuration:

My nginx experience is very low, so I am unable to really comment on this. Can you see the requests made by the browser? Is the POST /ticket successful? Is it followed by a (failing) WebSocket GET /?ticket=... upgrade request?

POST /ticket is successful however I don't see any websocket GET /?ticket= upgrade request:

Ondřej Žára · Answer 10 · Fri Sep 04 2020 04:23:28 GMT+0800 (China Standard Time)

Interesting! I see three POST /ticket requests, that does not feel right. What are their responses, please?

borisrunakov · Answer 11 · Fri Sep 04 2020 04:26:06 GMT+0800 (China Standard Time)

ticket: 720a07c260c72dc78c1232d6b331c5b0
ticket: 2fa4689ba3e1d92f1a35139bb8ddf704
ticket: 7571c2b2615d2889a24ec170cdb3548e

Ondřej Žára · Answer 12 · Fri Sep 04 2020 04:33:25 GMT+0800 (China Standard Time)

Okay, those are three distinct connection attempts. Every one of those is successful, so the following WebSocket connection has to fail. This process is also reported to the console via console.warn (https://github.com/ondras/cyp/blob/master/app/js/mpd.js#L142), do you happen to see something displayed in the console?

borisrunakov · Answer 13 · Fri Sep 04 2020 04:36:34 GMT+0800 (China Standard Time)

No, nothing is displayed in the console, besides ws2mpd attached to a http server { address: '::', family: 'IPv6', port: 3378 }

Ondřej Žára · Answer 14 · Fri Sep 04 2020 04:37:24 GMT+0800 (China Standard Time)

No, nothing is displayed in the console,

I mean the browser's console (devtools -> "console" tab).

borisrunakov · Answer 15 · Fri Sep 04 2020 04:41:40 GMT+0800 (China Standard Time)

Sorry misunderstood you!

Uncaught (in promise) TypeError: this._mpd is undefined
    _updateStatus https://mydomain.com/cyp.js:911
    _onAppLoad https://mydomain.com/cyp.js:903
    connectedCallback https://mydomain.com/cyp.js:735
    connectedCallback https://mydomain.com/cyp.js:589
    async* https://mydomain.com/cyp.js:633
cyp.js:911:16
    _updateStatus https://mydomain.com/cyp.js:918
    _onAppLoad https://mydomain.com/cyp.js:903
    connectedCallback https://mydomain.com/cyp.js:735
    connectedCallback https://mydomain.com/cyp.js:589
    InterpretGeneratorResume self-hosted:1478
    AsyncFunctionNext self-hosted:684
    (Async: async)
    <anonymous> https://mydomain.com/cyp.js:633
    InnerModuleEvaluation self-hosted:2356
    evaluation self-hosted:2327
Uncaught (in promise) TypeError: this._mpd is undefined
    _updateCurrent https://mydomain.com/cyp.js:922
    _onAppLoad https://mydomain.com/cyp.js:904
    connectedCallback https://mydomain.com/cyp.js:735
    connectedCallback https://mydomain.com/cyp.js:589
    async* https://mydomain.com/cyp.js:633
cyp.js:922:16
    _updateCurrent https://mydomain.com/cyp.js:957
    _onAppLoad https://mydomain.com/cyp.js:904
    connectedCallback https://mydomain.com/cyp.js:735
    connectedCallback https://mydomain.com/cyp.js:589
    InterpretGeneratorResume self-hosted:1478
    AsyncFunctionNext self-hosted:684
    (Async: async)
    <anonymous> https://mydomain.com/cyp.js:633
    InnerModuleEvaluation self-hosted:2356
    evaluation self-hosted:2327
Uncaught (in promise) TypeError: this._mpd is undefined
    _sync https://mydomain.com/cyp.js:1152
    _onAppLoad https://mydomain.com/cyp.js:1144
    connectedCallback https://mydomain.com/cyp.js:735
    connectedCallback https://mydomain.com/cyp.js:589
    async* https://mydomain.com/cyp.js:633
cyp.js:1152:15
    _sync https://mydomain.com/cyp.js:1156
    _onAppLoad https://mydomain.com/cyp.js:1144
    connectedCallback https://mydomain.com/cyp.js:735
    connectedCallback https://mydomain.com/cyp.js:589
    InterpretGeneratorResume self-hosted:1478
    AsyncFunctionNext self-hosted:684
    (Async: async)
    <anonymous> https://mydomain.com/cyp.js:633
    InnerModuleEvaluation self-hosted:2356
    evaluation self-hosted:2327
Uncaught (in promise) TypeError: this._mpd is undefined
    _sync https://mydomain.com/cyp.js:1261
    _onAppLoad https://mydomain.com/cyp.js:1253
    connectedCallback https://mydomain.com/cyp.js:735
    connectedCallback https://mydomain.com/cyp.js:589
    async* https://mydomain.com/cyp.js:633
cyp.js:1261:15
    _sync https://mydomain.com/cyp.js:1262
    _onAppLoad https://mydomain.com/cyp.js:1253
    connectedCallback https://mydomain.com/cyp.js:735
    connectedCallback https://mydomain.com/cyp.js:589
    InterpretGeneratorResume self-hosted:1478
    AsyncFunctionNext self-hosted:684
    (Async: async)
    <anonymous> https://mydomain.com/cyp.js:633
    InnerModuleEvaluation self-hosted:2356
    evaluation self-hosted:2327

borisrunakov · Answer 16 · Fri Sep 04 2020 04:52:24 GMT+0800 (China Standard Time)

I would like to have it configured like so , so that I don't need to open an extra port on my firewall.

So, what should the setup look like?

Typically:
1. mpd runs on host1:port1 (default = localhost:6600)

2. cyp/ws2mpd runs on host2:port2 (default = localhost:8080)
The web app then tries to
1. make GET and POST requests to http://host2:port2

2. make a WebSocket connection to ws://host2:port2
What values of {host,port}{1,2} do you want? Apparently nginx is able to proxy WebSocket traffic as well: https://www.serverlab.ca/tutorials/linux/web-servers-linux/how-to-configure-nginx-for-websockets/

so everything works with host2:port2 correct ?

Ondřej Žára · Answer 17 · Fri Sep 04 2020 14:12:42 GMT+0800 (China Standard Time)

Sorry misunderstood you!

These console logs look like they are created after the app unsuccessfully tries to establish the WebSocket connection (three times). They simply state that the app is missing the mpd connection, so no real insight here.

I believe there should be another log before these, where the particular WebSocket connection error shall be displayed in more detail.

Perhaps you can try with another browser that could provide more info about the attempt to establish a WebSocket connection?

so everything works with host2:port2 correct ?

As far as the client application is concerned, yes. JavaScript makes HTTP/WebSocket requests only to host2:port2.

borisrunakov · Answer 18 · Fri Sep 04 2020 14:27:43 GMT+0800 (China Standard Time)

I think we can close the issue, since it is nginx related and will let you know if I come up with something !
Really appreciate your help :)

Ondřej Žára · Answer 19 · Fri Sep 04 2020 20:18:53 GMT+0800 (China Standard Time)

Really appreciate your help :)

You are welcome! I suggest having a look at proxying WebSocket requests with nginx.

Ondřej Žára · Answer 20 · Wed May 11 2022 19:18:55 GMT+0800 (China Standard Time)

Added to README in 148d215