Website owners will always find it frustrating when they’re forced to deal with site errors when they’re not entirely sure why it is happening. The all-too-common 502 Bad Gateway Error can have various potential causes. When you’re unsure what is causing it, you’re obligated to test multiple solutions until you find the right one.
Here at 4GoodHosting, we were once greenhorns when it came to troubleshooting web development issues, but in the many years since what’s helped make us a top Canadian web hosting provider is the way we’ve gone through the process to be ever more capable with solving our customers technical support requests. Enabling them to be able to undertake these ‘repairs’ on their own is beneficial all round, so today we’re going to discuss the 502 error in WordPress and the best methods for remedying the situation. Let’s dig into it
What’s the 502 Bad Gateway Error?
Browsing a website involves the browser sending many requests to the server hosting the site. In normal situations when there is nothing amiss the server will send back the information you asked for, and then the site will load it. However, if the server does not return those requests and instead comes back with ‘invalid’ for the request, then the connection has timed out or there is another problem.
All of this stems from the fact that the connection between the websites and your browser is not a straightforward one. For instance, your request via your browser could be routed though the proxy server before it makes the way to the server hosting the site. When this is the scenario, it can be difficult to pinpoint exactly where the problematic issue is occurring.
Even worse, many websites will use more than one server, and it can make things more complicated when you have to locate which server’s error is leading to the 502 error.
Here are the 2 most common causes for the 502 Bad Gateway Error:
Something is wrong in your DB
In these cases the server hosting the website has timed out and is currently unavailable, or is not working as it should. Your server proxy server goes wrong as a result.
One of your themes or plugins includes faulty PHP scripts
When you can identify the fact that the issue is located within the server it is generally better news because it means the issue is on your end, and that means you’ve got the means of fixing it. You need to contact your provider and explain the situation. Most websites cannot afford any long-term downtime, so you really stand to benefit from being able to take action on your end and troubleshoot the problem on your own without delay
How to Fix the 502 Bad Gateway Error in WordPress
Before you move into troubleshooting mode, you can run a quick test to determine if the server is working as normal. Try running a traceroute to check if the server is available. If you pass this test, then the issue is probably exclusively on your end. If the traceroute test shows your server is not reachable, you will have to contact your WordPress hosting provider.
Resetting your routers and checking your DNS settings is also worthwhile. Sometimes little fixes like this can make the 502 error disappear, and they’re simple enough steps to try on your own. Failing that, here are the best fixes for re-establishing accessibility for your website.
Clear Your Browser Cache
When your browser relies on its cache rather than loading the latest website version from remote server it is possible to have the 502 Bad Gateway. Fortunately, the fix is easy in these instances. Reloading the website server times should do the trick. However, if you still have the 502 error message on your screen and you are on Windows, the CTRL +F5 prompt will make your browser reload the site with the latest version and empty your browser cache. This method works well for nearly all browsers, and including Firefox and Chrome.
For OS X things are a little bit different. The prompt is CMD+CTRL+F5 in Safari.
Should this fix fail then you have to manually empty the browser cache. Those using Chrome can do this by going to ‘Settings’ >> ‘Advanced’ and find the option ‘Clear Browsing Data’.
Next, locate the option ‘Cached Images and Files’ under the ‘Basic’ tab, and then press ‘Clear Data’ once you have selected it. Do keep in mind though that if you do not disable the setting before you press the ‘Clear Data’ button, this order will proceed to delete all your browsing history. If that would be a problem for you then this approach my not be best for you.
For Firefox, Internet Explorer, Safari and almost all other browsers you can perform this process to deal with the situation above. Try reloading the website again after clearing the browser cache. Usually the 502 error will have been fixed but if the problem is still there then you need to move on to more heavy-handed fixes.
Temporarily Disable Your CDN
As mentioned, sometimes browser requests may be routed through the reverse proxy server. This means that you are utilizing the proxy server to place an intermediary between your server and the audience’s browsers.
Services like CDN route incoming traffic relying on the reverse proxy to move that traffic with more efficiency. The additional layer sometimes causes trouble as you attempt to connect to the website’s original server. The 502 Bad Gateway Error will stem from this issue as well.
You can determine if your CDN is the cause of the issue by temporarily disabling your CDN. After that, you can test if your site is loading right without the service. The disabling process can be different depending on the CDN services you are applying to your site, but generally it’s not particularly difficult.
After disabling your CDN service, your site will then load directly from your original server and able to skip the standard request / permission process to access it. If your site loads then you can understand the issue must be related to your CDN service. You will unfortunately have to wait quite some time to re-enable the CDN service. After that happens you will of course want to check that the 502 Error has been eliminated.
If this doesn’t work either, try recommendation number three.
Test Your WordPress Plugins and Themes
Sometimes the issue is directly in the structure and makeup of your WordPress website.
There may by even a tiny error within your WordPress themes or plugins where one of them is trying to execute a script that the original server cannot load correctly. This can lead to an invalid response with the browser sending requests that lead to the 502 error.
You are only able to activate one WordPress theme on the site, so it is simple to deactivate the one you are currently using and then switch to the default theme temporarily. Then try to access your site again to determine if the problem is solved. Oppositely, you can activate multiple plugins on your site but this will mean you need to test all of the plugins you are using on your site to find out which one is the culprit.
In instances where you are blocked out of the WordPress dashboard because of the error, you must disable these plugins and themes manually. You don’t actually delete them though, and reactivating them shouldn’t take much time.
Make sure you take a backup of your site before trying this.
FileZilla is probably the best choice for doing this. Open the FTP client you selected and log into your site via FTP client and proceed to find ‘public html’ >> ‘wp-content’ >> ‘plugin folder’. Each plugin you installed on site should be locatable, no matter whether it is active or not.
Right click on a plugin folder to view the different options that can be applied to the plugin, One of them is ‘Rename’. Choose that option and then change the folder name to another one like ‘disabled.thepluginname’ or something similar. Make it easy identifiable as your temporary one only used for this purpose.
When you then access your site again you will not find these plugins disabled on the site. It will still load without these plugins. If these plugins are behind the 502 error, you’ll be able to browse normally now. Also, be sure to apply the command CTRL+F5 prompt to make you’re deleting the browser cache before reloading.
It is recommended to disable your plugins one by one to test which one is the problem. You also need to remember to restore the plugins that you have determined are NOT the problem. For WordPress theme, the same process is effective for testing it.
Once you find the right plugin or theme that’s causing the 502 error, go ahead and delete it all and find another replacement. Or if the plugins or themes are outdated, you can try to update it and see whether that’s an additional fix that improves page loading speed or general performance.
WordPress makes website creation much easier, and troubleshooting it is often not as challenging as you might think – if you know what you’re doing. Some errors have multiple potential causes, but if you can go through a process-of-elimination method and go through these steps here then you’ll find you can do the troubleshooting on your own. Again – always remember to take copies or backups of your website before you make any major changes.