Troubleshooting Cloudflare Issues with Gravity Forms

Overview

This article explains how Cloudflare’s script optimization and caching features can interfere with Gravity Forms, and how to identify and resolve the conflict.

Cloudflare sits in front of your site rather than inside WordPress, so its settings live in the Cloudflare dashboard and apply before a request ever reaches your server. Two of its features affect a form: Rocket Loader changes how your JavaScript runs, and HTML caching (Automatic Platform Optimization, or a Cache Rule) stores the page itself. By default, Cloudflare caches static files only, not your pages.

Symptoms

  • Conditional logic or other JavaScript-driven features do nothing, with no error shown.
  • Fields display incorrectly.
  • The form fails to submit or shows a submission error.
  • A blank screen appears after submission.
  • Form data is not processed correctly.
  • Save and Continue behaves unexpectedly.
  • Conversational Forms or other add-on functionality breaks.
  • The form works when you are logged in, but not for cached public visitors.

Note: Failures caused by cached HTML only occur after a page has been cached for some time. Purging the cache generates a new page with new security tokens, so the form works again immediately, but breaks again later. Test on a page that has been sitting in the cache, while logged out, rather than one you just purged.

Why It Happens

Rocket Loader

Rocket Loader defers your JavaScript until after the page has rendered. Gravity Forms scripts need to run for conditional logic, multi-page navigation, and submission, so deferring them can break those features.

Cloudflare dashboard › Speed › Settings › Content Optimization

Automatic Platform Optimization

Automatic Platform Optimization (APO) caches your site’s HTML at Cloudflare’s edge, and it is enabled through the Cloudflare WordPress plugin. A cached page carries the security token from when it was built, and that token is reused until the cache is purged. WordPress tokens expire within 12–24 hours, so Ajax submissions and forms that require login fail once the token has expired. APO bypasses the cache for logged-in users, which is why a form can work for you and fail for everyone else.

Cloudflare dashboard › Speed › Settings › Content Optimization

Cache Rules That Cache HTML

A Cache Rule that caches whole pages has the same effect as APO, and it will cache your form along with them. Unlike APO, a Cache Rule does not skip logged-in users unless the rule says to.

Cloudflare dashboard › Caching › Cache Rules

Email Address Obfuscation

Email Address Obfuscation rewrites email addresses in your page HTML and adds a small decode script, which can change confirmation text or other content that includes an email address. It is worth ruling out when nothing else explains the behavior.

Cloudflare dashboard › Security › Settings

Confirm the Issue

  1. Right-click the form page and select View Page Source, then search for rocket-loader.min.js. If it appears, Rocket Loader is active on this page.
  2. Open your browser’s developer tools, reload the page, and select the document request (the page itself, not a stylesheet or script). Check cf-cache-status. HIT means Cloudflare served a cached copy. DYNAMIC means the HTML was not cached.
  3. Test the form while logged out, in a private window. APO does not serve its cached HTML to logged-in users, so a form that works while you are signed in to WordPress has not been tested yet.
  4. If the problem is with scripts or content rather than cached tokens, temporarily turn off one option at a time (Rocket Loader, Email Address Obfuscation) and retest the form after each.
  5. If submissions seem to be going missing, open Forms › Entries and check the Spam view. The entry notes name the filter that flagged it.

How to Fix It

  1. Turn Rocket Loader off at Speed › Settings › Content Optimization and retest. This is the quickest way to confirm or rule it out. To keep it enabled everywhere else, create a Configuration Rule under Rules › Configuration Rules that turns it off only for the URLs that host your forms.
  2. If HTML is being cached, exclude your form pages from the cache, either by adding a Cache Rule under Caching › Cache Rules that bypasses the cache for those URLs or by excluding them from APO.
  3. If email addresses in your confirmation or other content look altered, turn off Email Address Obfuscation and retest.
  4. Purge the cache at Caching › Configuration after any change, then retest in a private window.
  5. Development Mode temporarily bypasses caching for three hours, which is useful while testing, but it expires on its own and is not a fix. Rocket Loader is separate from Development Mode and has to be disabled independently.
  6. Once you know which option is responsible, leave the others enabled. If the problem persists, contact Cloudflare support, or your host if they manage your Cloudflare account, for help with the caching and optimization configuration.

Resources

​Disclaimer: Third-party services, plugins, or code snippets that are referenced by our Support documentation or in Support Team communications are provided as suggestions only. We do not evaluate, test or officially support third-party solutions. You are wholly responsible for determining if any suggestion given is sufficient to meet the functional, security, legal, ongoing cost and support needs of your project.

Feedback, feature, and integration requests, and other functionality ideas can be submitted at https://gravity.com/feature-request/.