CODEWITHSUNDEEP
javascriptckeditorbrowser-cache
giammin
giammin

Reputation: 18958

Force CKEDITOR to refresh config

I created a cms application that use CKEDITOR and when I add some functionality to CKEDITOR I need to refresh some CKEDITOR .js /.css file.

But CKEDITOR force the browser to cache them.

I see that it uses a querystring to all .js/.css files

This querystring reflect the CKEDITOR version I suppose:

/Js/ckeditor/config.js?t=CAPD
/Js/ckeditor/lang/it.js?t=CAPD
/Js/ckeditor/plugins/onchange/plugin.js?t=CAPD

Is there an embedded method to do that in CKEDITOR?

I could not find anything in the documentation. I'm using CKEDITOR 4

The main problem is that when I upload some changes they are not updated by the clients and new functionality are not available or worst case CKEDITOR does not work.

Upvotes: 38

Views: 35536

Answers (11)

Fenix Aoras
Fenix Aoras

Reputation: 241

As this thread is popular, let me share my experience -

I tried @giammin answer, but wasn't working. I ended up changing config.js 's permissions to 664, then it worked like a charm.

Upvotes: 0

wloges
wloges

Reputation: 1

Method wich works is put CKEDITOR with improved config and css files to the new subcatalog:

src="/ckeditor_new_one/ckeditor.js"

Upvotes: 0

Kidquick
Kidquick

Reputation: 1142

This trick works in Firefox for not just CKEditor but for any page on which you want to toggle local caching.

  1. Open Firefox debugging console (F12).
  2. Open console settings (F1).
  3. Enable "Disable HTTP Cache (when toolbox is open)".
  4. Keep console open :)

After a very brief check, I could not find a similar setting in Chrome nor IE.

HTH

Upvotes: -1

Jawwad Ahmed
Jawwad Ahmed

Reputation: 317

Add the following code to ckeditor.js

/*Lets Create a random number*/

 function randomString(length, chars) {
    var result = '';
    for (var i = length; i > 0; --i) result += chars[Math.floor(Math.random() * chars.length)];
    return result;
}
var rString = randomString(4, '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ');

After that substitute the value timestamp:rString in ckeditor.js.

Upvotes: 0

palmej2
palmej2

Reputation: 93

Here's what I did to fix it. In your /ckeditor/config.js add this line:

CKEDITOR.timestamp = 'something_random';

Update "something_random" every time you have plugin updates.

In your page that uses it, make sure and load the resources like this:

<script type="text/javascript" src="/ckeditor/ckeditor.js"></script>
<script src="/ckeditor/config.js?v=something_random"></script>

By doing this the config.js will get loaded twice because CKEditor will load it on it's own however it will still work fine, and this should give you the control you need to get an automatic refresh on all browsers. I am a .NET developer, and actually put the /ckeditor/config.js in my bundler, so it gets the version on the querystring automatically, but if you aren't using a fancy bundler, just do what I said above manually with the ?v=something_random.

Upvotes: 5

Alfred Armstrong
Alfred Armstrong

Reputation: 238

I found a much simpler method, in case anyone is still frustrated by this.

If you open the config file URL with the timestamp appended (eg. ?t=XYZD) in your browser, hard-refresh it, then return to your application page and refresh that, you should get the new version of the config file.

You need to use the same timestamp as is set by ckeditor in the source of the page. If you use developer tools or Firebug, typing CKEDITOR.timestamp into the console will give you the value to use.

Upvotes: 2

izus
izus

Reputation: 115

On Firefox:

  1. Go to about:config
  2. Set network.http.use-cache to false

Upvotes: -3

norman.lol
norman.lol

Reputation: 5374

For me setting CKEDITOR.timestamp = +new Date works super fine. I wrote it in a JS that will be loaded before any other CKEditor JS will be loaded (see my custom Drupal module).

Now the query that is appended to the custom plugin or custom config JS gets refreshed every time I reload my browser. I guess that might work with custom CSS as well, but I didn't test that.

Upvotes: 3

giammin
giammin

Reputation: 18958

I have found a quite elegant way:

It is enough to set:

CKEDITOR.timestamp='ABCD';

just after you link ckeditor.js or anyhow before ckeditor loads all its files

this is the variable CKEDITOR uses to add timestamp to all .js .css files it loads dynamically.

So every time I change those files I update that variable and browsers will reload them.

Upvotes: 70

Nick Zinger
Nick Zinger

Reputation: 1174

The timestamp solution didn't work for me so in case anyone else has the same issue, I appended ?v=date to where I'm including ckeditor.js, and then again inside ckeditor.js where config.js is referenced.

It seems that since config.js is being cached, the new timestamp doesn't get used. At least not until after a few refreshes, but that's not something I can tell my users to do.

Upvotes: 0

Bas Tuijnman
Bas Tuijnman

Reputation: 237

You could always add a unique timestamp as a variable in your url, or just do a hard refresh (CTRL + F5)

Upvotes: 0

Related Questions