Orange cloud breaks websocket app

Hellooooooo
Cloudflare and general programming noob here.
I've made a website that relies on a secure websocket server.
When the DNS entry for the subdomain for this server is set to DNS only (grey cloud), the site works fine.
However, when the DNS entry is set to Proxied (orange cloud), the site breaks completely because the websocket fails to connect.
Would anyone be able to assist me in debugging this please? I don't know where to start.

KKris Hellooooooo Cloudflare and general programming noob here. I've made a website th...

Chaika•6/8/24, 7:30 PM

Hello,

I would start with ensuring websockets are enabled in your Cloudflare config, under "Network" -> "Websockets" when you navigate to the Cloudflare dashboard -> websites -> then your website.
I would then double check your encryption mode is "Full (Strict)" under SSL/TLS -> Overview
Then I would try to wrangle an error out of it. Open up inspect element/dev tools before the websocket connection tries, look for an error in console or the response from the websocket under the status tab.

KrisOP•6/8/24, 7:31 PM

websockets is enable in my cloudflare config

KrisOP•6/8/24, 7:32 PM

SSL/TLS mode is flexible because I'd prefer to use my let's encrypt certificate, though I could change it as a last resort if that's what is causing the issue

KKris SSL/TLS mode is flexible because I'd prefer to use my let's encrypt certificate,...

Chaika•6/8/24, 7:32 PM

What do you mean "prefer to use your lets encrypt certificate"?

KrisOP•6/8/24, 7:32 PM

browser is unhelpful

Chaika•6/8/24, 7:32 PM

This is what Flexible is doing
User <- HTTPS (Cloudflare Cert) -> Edge <- HTTP (no cert) -> Origin

KrisOP•6/8/24, 7:33 PM

I know

KrisOP•6/8/24, 7:33 PM

what I meant was I'd rather not change to full (strict), which as I understand it would force me to use a cloudflare certificate

KrisOP•6/8/24, 7:33 PM

brb

KKris what I meant was I'd rather not change to full (strict), which as I understand i...

Chaika•6/8/24, 7:33 PM

no, full strict works with any trusted certificate

Chaika•6/8/24, 7:34 PM

Your origin needs to be able to support an SSL certificate that is:

Unexpired, meaning the certificate presents notBeforeDate < now() < notAfterDate.
Issued by a publicly trusted certificate authorityor Cloudflare’s Origin CA.
Contains a Common Name (CN) or Subject Alternative Name (SAN) that matches the requested or target hostname.

Chaika•6/8/24, 7:34 PM

Flexible means no encryption between Edge and Origin at all, completely plaintext. You never ever want to use Flexible or Full, only ever Full (Strict), or if you don't want to support SSL at all, Off.

Chaika•6/8/24, 7:36 PM

When I try to go to I get the typical redirect loop you'll get with Flexible as well, as Flexible makes CF send a plaintext redirect and your origin tries to upgrade it to https, and that just loops forever.
If you've already got a valid Let's encrypt cert on your origin, then you should have no issues switching on Full (Strict) and it should remove that issue at least

KrisOP•6/9/24, 8:53 AM

Full (strict) fixes the problem, thank you