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

I’m 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.

Sem título

Any ideas will be greatly appreciated.

This image better shows the type of the requests.