If you’re using CloudFlare, you may find that it initially works fine and significantly speeds up your website page load times. Then, after a period of weeks or months, you may start to notice a lot of Error 522 errors stating that the connection timed out — similar to the message displayed below.
The image shown here has the ID and website name erased for privacy. The error suggests there is a problem with the host.
This problem will likely go away if you enter the diagnostic mode in CloudFlare and temporarily disable CloudFlare caching of your site. The problem isn’t actually with your host or website, but with the connection between CloudFlare and your website.
This problem is particularly frustrating because the reason you likely setup CloudFlare was to avoid site outages and performance problems.
CloudFlare Support Documents
If you go to the CloudFlare support page, and click on the “Get More Help” button you can begin to submit a new support ticket. You might describe your problem as follows: “When Cloudflare is on, my site doesn’t load. Temporary disable fixes the problem.”
Before being able to submit a support request ticket, you will be shown a list of options that may help with your question. One suggestion is to read the document “Community Tip – Fixing Error 522: Connection timed out.” [View]
It’s apparently a fairly common problem. One of the suggestions on that community support page is to check your website firewall settings and whitelist all of the CloudFlare IP addresses. A link to the current CloudFlare IP addresses is provided. [View]
You might try using a WordPress plugin such as WordFence that lets you enter whitelisted IP addresses. This could help ensure that CloudFlare doesn’t get blocked. The free version of that plugin is adequate.
An additional support document is available that covers many of the 500 series (5xx) of errors. [View]
CloudFlare Support Diagnostics
After reading the suggested support documents, the next step in the trouble ticket request process is to run a brief diagnostic of your site to provide additional insights.
The results of the diagnostics may be something like this:
- [your website] is returning a high percentage of HTTP 5xx server errors Review 5xx Server Error before filing a Cloudflare Support ticket.
- The origin web server for [your website] is responding slowly to initial requests for uncached HTML content. To remove this performance bottleneck, look at your server’s ability to return HTML faster and/or implement HTML caching in Cloudflare. You may benefit from caching static HTML and anonymous page views. Learn how to do this in: WordPress, Drupal and Magento.
Given those suggestions, you may want to use a website cache plugin like WP-Optimize or WP Super Cache.
This may seem redundant since CloudFlare is supposed to serve the function of caching your site content. However, it is suggested above probably because it will help with content delivery to CloudFlare.