Error 522 with all html requests, css and js load just fine

Traefik Traefik v2
1

I have a home lab which consists of a Traefik proxy and a few web apps behind it, all containerized on docker. When connecting to the Traekfik proxy directly I can successfully and quickly access every app behind it, however, once I turn on Cloudflare proxy things change as following:

the landing page loads but some elements are broken;
the pages takes a looong time to finish loading (timeout). When bypassing Cloudflare the load times are good;
authentication will break for some apps.

Inspection shows that most html requests show the error 522, while css, js and images load just fine.

My certificates are directly configured in Traefik, I’m not using Cloudflare for that, and the HTTPS traffic flows using port 2053 because this is the only alternative provided by Cloudflare. Ports 80 and 443 are blocked by my ISP. Even so, once turning Cloudflare’s proxy off, all works as expected in the same port 2053.

e781a94c85914a55516ccf2b80e48e645bc2c7cd

5c6c4b0801db1405a87f2a4bebd145e6384a6303

2

So it seems to be a Cloudflare problem :smiley: Maybe ask in their community forum?

For Traefik, maybe enable and check the Traefik debug log and access log.

3

You have a good point and I have done it. Unfortunately, because I got no response, I was hoping someone here could have came across similar issues and, maybe, tweaking headers or something like this.