Websocket connection failed on community edition

[svandeneertwegh]

Past Issues Searched

• I have searched open and closed issues to make sure that the bug has not yet been reported

Issue is a Bug Report

• This is a bug report and not a feature request, nor asking for self-hosted support

Using official Plausible Cloud hosting or self-hosting?

Self-hosting

Describe the bug

app-7a5f917ab82642c1…42aaea32.js?vsn=d:6 WebSocket connection to 'wss:///live/websocket?_csrf_token=X39ZCnwaKDAuBBQUETAuCSF…UBMB0e67tK-jA_ojlgIrKVd7BtfJKv&_mounts=0&_live_referer=undefined&vsn=2.0.0' failed:

Expected behavior

Succesful made websocket connections for small charts

Screenshots

Environment

- OS: Ubuntu 23.10
- Browser: Google chrome
- Browser Version: latest

[ruslandoga]

👋 @svandeneertwegh

Can you please share the latest logs from docker compose logs plausible and your networking configurations (reverse proxies, cdns, etc.)?

[svandeneertwegh]

plausible-1 | Loading plausible..
plausible-1 | Starting dependencies..
plausible-1 | Starting repos..
plausible-1 | create Plausible.Repo database if it doesn't exist
plausible-1 | create Plausible.IngestRepo database if it doesn't exist
plausible-1 | Creation of Db successful!
plausible-1 | Loading plausible..
plausible-1 | Starting dependencies..
plausible-1 | Starting repos..
plausible-1 | Running migrations for Elixir.Plausible.Repo
plausible-1 | Running migrations for Elixir.Plausible.IngestRepo
plausible-1 | Migrations successful!

[ruslandoga]

What about Google Chrome console logs? Does it include any kind of reason for the connection failure?

[svandeneertwegh]

[ruslandoga]

What about the "Console" tab?

[svandeneertwegh]

[ruslandoga]

Is there anything showed if you click on one of these log lines?

[svandeneertwegh]

No when clicking on it it attempts to open the wss link.. but doesnt work.

[ruslandoga]

I don't mean clicking on the link, but outside of it :) E.g. on the ➤ symbol.

[svandeneertwegh]

[ruslandoga]

Do you use any proxies?

[svandeneertwegh]

I use nginx and use the tracker /script.js proxied. Maybe i need to add some websocket stuff to the nginx from the stats server?

[ruslandoga]

Most likely, yes :)

I'm going to move it to discussions since it doesn't seem to be an issue with Plausible itself.

[svandeneertwegh]

Great. Can you provide the websocket block in the nginx vhost for stats server?

[ruslandoga]

I'm not using Nginx myself, so I wouldn't know the exact way to do it. But maybe one of these would be useful to you:

• https://zaiste.net/network/nginx/howtos/nginx-config-elixir-phoenix/
• Documentation to configure nginx to work with websockets phoenixframework/phoenix#663
• https://copyprogramming.com/howto/how-to-set-up-websockets-with-phoenix-behind-nginx#google_vignette

[svandeneertwegh]

I've solved it.

I added this:

proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "Upgrade";

To the location / block in nginx vhost where proxy_pass is set.

With the above setting active it does then support websockets.

[kurdin]

@svandeneertwegh Thank you!

[ruslandoga]

👋 @svandeneertwegh @kurdin

Would you be able to review plausible/community-edition#113?
Is that all that's required to make websockets work in nginx?

[kurdin]

@ruslandoga I don't see review button on the PR. Found it!
I created an update to the PR with adding more options to nginx reverse proxy settings
plausible/community-edition#119

[flipzoom]

Plausible with Plesk + NGINX + WS (Websocket) Error

For all those who run the Plausible CE version on a server with Plesk, here is the way to get WS running in Plesk.

1. Go to /var/www/vhosts/system/<yourdomainname>/conf/nginx.conf
2. Find the block

#extension docker begin
location ~ ^/.* {
	proxy_pass http://0.0.0.0:8000;
	proxy_set_header Host $host;
	proxy_set_header X-Real-IP $remote_addr;
	proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
	proxy_set_header X-Forwarded-Proto $scheme;
}
#extension docker end

3. Copy this block
4. Go to Your Domain > Websites & Domains > Dashboard > Docker Proxy Rules and remove the rule created for Plausible

5. Go to Your Domain > Websites & Domains > Hosting DNS > Apache & nginx
6. Deactivate the proxy mode and the Serve static files directly by nginx

7. Add the following and extended rule set under "Additional nginx directives"

location ~ ^/.* {
	proxy_pass http://0.0.0.0:8000;
	proxy_set_header Host $host;
	proxy_set_header X-Real-IP $remote_addr;
	proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
	proxy_set_header X-Forwarded-Proto $scheme;
	proxy_set_header Connection 'upgrade';
	proxy_set_header Upgrade $http_upgrade;
	proxy_http_version 1.1;
}

8. Save your changes and restart nginx (via SSH sudo systemctl restart nginx or directly in Plesk Tools & Settings > Services Management > Reverse Proxy Server (nginx))

The dashboard should now work with Websocket. When copying the Docker rules, make sure that the port is correct if you have specified a different one and that the IP address is 0.0.0.0. Do not make any changes to the vHost template directly, these will be overwritten by Plesk.