Daan Seuntjens
Daan Seuntjens

Reputation: 960

Wordpress using outdated versions of the included javascript files

I'm constantly uploading new versions of a javascript file to my wordpress site using ftp.

But when I visit the page where the javascript file is used, it uses an outdated version of the javascript file. An example of url of the used file:

myurl.com/../js/my_file.js?ver=919004c7f6ced.....8f8941dfa68c2e

But if I directly go to the file using myurl.com/../js/my_file.js it shows the most up to date version.

I'm assuming this is caused by something that's caching my files. I already tried deleted the cache of my cache plugin and I've deactivated it, but it's still using outdated versions.

How can I force my website to use the most up to date version for certain files?

Upvotes: 3

Views: 2838

Answers (1)

FluffyKitten
FluffyKitten

Reputation: 14312

A bit of background first: The ver on the included file tells the browser what version to use, and if it already has that version loaded it will use the cached version. This is what you are seeing here - even though you have added a new js file, the browser is still using version 919004c7f6ced.....8f8941dfa68c2e.

This version is specified in the HTML for the page (i.e. not the js file) so it is the page that is getting cached

There are a number of possible causes for this:

CACHING

  1. Browser Caching: The browser is using a cached version of the page, clearing your browser cache should fix this. Or disable the cache - see note below.
  2. Server Cache: Some hosting servers also use caching to minimise the load on them, especially in shared hosting. How or when this is cleared depends on your hosting. Note, if you are using a service such as CloudFlare, this can also have the page cached!
  3. Caching Plugins: Obvious one, but worth including for completeness - caching plugins will have their own cache and will need to be cleared. Note, the server and browser caches could still have the pre-cleared versions
  4. Other Plugins with caches: Other plugins that are not specifically caching plugins could create a cache. This includes minifier plugins - they can create a cache with the minified and/or combined files.

CODE

  1. Registered Version: Your WP theme will (or at least should) register the scripts using wp_register_script or wp_enqueue_script - both of these functions let the code specify what version to use. You should check the code that is creating the version number for the following:
  • The version is not being updated in the code
  • The version is not specified at all and is being set to the WP version by default (Note this isn't the case here but I have included it for completeness)
  • The version is not specified at all and is being added by some other resource

Temporary Workaround for Testing: If you just want to test the new script immediately, you could rename the file and change the name in the wp_enqueue/register_script function - obviously this isn't a long term solution, but it can help if you need to test something or make it available immediately without all users having to wait for the cached file to be changed.

Disable Cache in Chrome for Debugging Only If the problem is only the browser cache, you can disable the cache in Chrome while you are debugging:

  • In DevTools, select the "Network" option and check "Disable Cache"

This will disable the cache only while DevTools is open so it won't affect anything else. Thanks to Daan for this link: How to Completely Disable Cache in Google Chrome

Upvotes: 2

Related Questions