Connection time out: Error Code 522
I am deploying my first next js app and trying to connect it with a custom domain from cloudflare. I deployed it using cloudflare pages which all works fine. However, once I connected a custom domain to it, I get a connection timed out: error code 522 when trying to open it on the custom domain. How do I fix this?
12 Replies
Did you add the Custom Domain from the Pages Project Custom Domain tab?
Yes
What is the status of the domain under that tab?
the status is active
Did you add exactly the hostname you are using? for example, if you are trying to use
www and your apex/root domain, both need to be Custom Domains under the Pages Project tabI might need some clarification on that
so i added the domain to the custom domains tab in my project and then also added the www cname as well
those are the two things i have done, is there anything else i need to configure?
if you want the www to work, you need to add the www subdomain as another Pages Custom Domain as well
hmm okay that fixed it
but i have another question in that all my styling disappears when i open it with the custom domain
from my next js app
it works fine on the pages.dev?
yea
In your cloudflare website in the dashboard, go to Speed -> Optimization -> Content Optimization. Disable Rocket Loader, and disable Auto Minify under that same section for all types
Magic Link: https://dash.cloudflare.com/?to=/:account/:zone/speed/optimization/content
it could also be just cache if you had the old broken styling at some point in the past but iirc nextjs should use hashes for all of the assets in the filenames
it was the cache
just cleared it and it worked
tysm