Wordpress behind a load balancer and CDN does not update CSS immediately

121 Views Asked by At

The CSS does not update immediately when the website is accessed via the domain. It is updated immediately when accessed via the VM's IP.

How can I configure the CDN to immediately update the cache content whenever there is a change in CSS?

Set Up

  • Bitnami WordPress
  • Google Load Balancer
  • CDN enabled

Enqueue CSS in WordPress

function wpscripts() { wp_enqueue_style('custom-style', get_stylesheet_directory_uri() .'/styles.css', array(), '1.0.0' ); } add_action( 'wp_enqueue_scripts', 'wpscripts' );

This is my CDN setting enter image description here

enter image description here

1

There are 1 best solutions below

2
MarcC On

The main purpose of a CDN is to cache your content at the edge as close as possible to your end users.

Looking at your settings it will stay there up to 6 months.

You can turn off the CDN option, evaluate the possibility to invalidate the caches, give your script a new name each time you update it.

*** edit: I'm adding details as apparently my previous answer was not clear enough.

1/ The easiest way, especially if you don't understand fully the CDN mechanics is to turn it off, you will always fetch the latest version of your content.

2/ If your content does not evolve too often you could ask the CDN to invalidate its cache (Google CDN is offering the option, check https://cloud.google.com/cdn/docs/invalidating-cached-content).

3/ You can version your content, a new version will get a new URL, the cache will not contain this version and will fetch it from the origin. For instance the wp_enqueue_style function you are using accepts a ver parameter. This parameter if provided is added to the URL as a query string for cache busting purposes (as described here https://developer.wordpress.org/reference/functions/wp_enqueue_style/). Looking at your CDN settings your cache key includes query strings so will take into account this version number.