Weird Caching Issue – WordPress + WP Job Manager + WP Engine + Cloudflare

Hi Team,

I having a weird cache issue on my site. Here is the complete scenario which will help you to understand the working.

We have a feature like, when the user upgrades to pro after successful payment through PayPal, then all the pro listing should be visible to them OR I can say they can access pro listing.

But after successful payment when a user tries to access the pro listing it shows “you need an upgrade to pro”. User roles also get updated from normal to Pro successfully. When the user refreshes one or 2 times then they can view the pro listing.

I just don’t want the user to refresh the page multiple time, which is anyway bad user experience.

To achieve this feature we have extended the WP Job Manager plugin along with the Ultimate Member and WooCommerce Subscription. So we have implemented the logic by overriding this template content-job_listing.php file.

After spending a couple of hours in all the directions and other parameters. I thought to reach out to you for more understanding. It seems like browser issue and I tried below-listed things but did not get success.

1) Used this Prevent Browser Caching plugin to avoid browser cache
Link: https://wordpress.org/plugins/prevent-browser-caching/ 

2) With the help of the send_headers wp action I tried to add header( ‘Cache-Control: no-store, no-cache, must-revalidate’ ); So I can bypass the browser cache. But no luck.

3) I have also applied the below function. Can you please verify that as well?

function pangain_get_listing_callback( $is_cache ) {
    $is_cache = false;
    return $is_cache;
}

add_filter( ‘get_job_listings_cache_results’, ‘pangain_get_listing_callback’, 10, 1 );

4) Appended a unique timestamp to each of the valid JS and CSS. I did show the ver of each JS and CSS updated properly but somehow Ajax grabs the cache data.

5) Tried below code as well to avoid cache from Ajax. But seems like it is not working as expected.

$(document).ready(function () {
     $.ajaxSetup({cache: false});
});

Ref Link: https://stackoverflow.com/questions/367786/prevent-browser-caching-of-jquery-ajax-call-result 

6) I am using WP Engine and I have already reached out to them to exlude that page from cache. I can see now that the page has been excluded.

7) My site is using Cloudflare as well. I have added Cache Level to Bypass in page rules. Let me know if I need to add anything else to the page rules.

8) I have also reached out to the StackOverflow and tried to apply the suggestion but no success.
Link: https://stackoverflow.com/questions/60548918/weird-caching-issue-wordpress-ultimate-member-wp-engine-cloudflare  

Question: While looking at your code I found this flush_get_job_listings_cache function. Can you please confirm that this might be the issue? How is the job listing grabing the data from Ajax? Can we add some cache = false statement there by any action or filter? If you are getting the data from cache then how can I flush that with hook?

Note: My site has the below-listed plugin activated specifically to the WP Job Manager.
1) WP Job Manager
2) WP Job Manager – Alerts
3) WP Job Manager – Go Fetch Jobs (Premium)
4) WP Job Manager – Indeed Integration
5) WP Job Manager – Job Tags
6) WP Job Manager – WooCommerce Paid Listings
7) WP Job Manager – ZipRecruiter Integration
8) WP Job Manager Field Editor

Here is the video which will explain the issue:
Link: https://www.loom.com/share/cd610aeb2cad4edc9ae5589be0c7448e

It would be a big help from you if you can share more thoughts on it.

Let me know if you need any further information.

Thanks!