Kimsea Sok
Kimsea Sok

Reputation: 150

CSS and JS not in Google CDN, How to Solve?

I deployed a WordPress site using high availability WordPress pre-built image on Google Platform.

I enabled the CDN on backend service, but GTmetrix said that CSS and JS are not in CDN.

I'm thinking that I did something wrong host and path rule. Am I right?

If so, could please check the bellow image and give me some advises.

Or you direct me to other solution. Thanks

enter image description here

Upvotes: 1

Views: 754

Answers (1)

Brent Chang
Brent Chang

Reputation: 382

In order to let Google Cloud CDN cache your CSS and JS files,

You'll need to modify the HTTP headers for CSS, JS files served from backend instance like the following:

Cache-control=Public

max-age or s-maxage directive, or an Expires

Since Google Cloud CDN does not provide console to configure the cache methods, the only way to do that is to modify the config files of your backend web server settings,

For example, httpd.conf or .htaccess for Apache HTTP Web Server, or nginx.conf for Nginx web server.


Map to your pre-built image, it'll be the Content Serving Nodes of the WordPress High Availability deployment, since only Content Serving Nodes are public-facing.

You can refer to the architecture diagram of WordPress High Availability: enter image description here

Your host and URL paths are right, that's how WordPress High Availability works.

Only admin related URLs served by Admin Node, other requests will be served by Content Serving Nodes.

I would suggest you do the following:

  1. Ensure that you enabled the Cloud CDN on the Content Serving Nodes.
  2. SSH into the Admin Node, edit or create the /var/www/html/.htaccess file to modify the Cache Headers:
# Cache 1 Month for CSS and JS files
<filesMatch ".(css|js)$">
Header set Cache-Control "max-age=2592000, public"
</filesMatch>
  1. Wait for a few minutes to let the Content Serving Nodes get the update for Admin Node.
  2. Run the test again to see if it works.

Upvotes: 1

Related Questions