强制CKEDITOR刷新配置

38

我创建了一个CMS应用程序,使用CKEDITOR。当我给CKEDITOR添加一些功能时,需要刷新某些CKEDITOR .js /.css文件。

但是CKEDITOR会强制浏览器缓存它们。

我发现它将查询字符串用于所有的.js/.css文件。

我想这个查询字符串反映了CKEDITOR的版本:

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

在CKEDITOR中有嵌入式方法来实现这个吗?

我在文档中没有找到任何信息。 我使用的是CKEDITOR 4。

主要问题是,当我上传一些更改时,客户端没有更新它们,新功能也无法使用,最坏的情况是CKEDITOR无法工作。


https://stackoverflow.com/questions/58013460/ckeditor-required-files-does-not-load - jamshid
11个回答

70

我发现了一种相当优雅的方法:

只需设置:

CKEDITOR.timestamp='ABCD';

在链接ckeditor.js后,或者任何在ckeditor加载其所有文件之前,

这是CKEDITOR用来为其动态加载的所有.js .css文件添加时间戳的变量。

所以每次我更改这些文件时,我会更新该变量,浏览器将重新加载这些文件。


7
这是 ckeditor 用于刷新其外部文件的方法,这个变量就是为此而设计的。所以,是的,这很优雅。 - giammin
这在IE10中对我的缓存没有产生影响。你能发布更多细节吗?比如何时何地执行此脚本? - ClearCloud8
1
在引用 ckeditor.js 并使用 ckeditor.replace() 或 ckeditor.inline 之前,在脚本元素后面添加 @ClearCloud8。 - giammin
对我来说这个方法不起作用,使用 ckeditor v4.6 我必须编辑 ckeditor.js 的第 5 行,其中有 timestamp:"GAGE"。在我的情况下,我正在修改模板 js 文件。 - drooh
我将其留空 CKEDITOR.timestamp = "";,现在查询参数 ?t= 根本不包括。因此,每次都会有一个新的配置加载。 - nik_m
这对我不起作用。我正在使用CKEditor 4.17。我将CKEDITOR.timestamp ='random_str';放在CKEDITOR.replace之前,并得到了错误c.render不是一个函数 :(( - Tommy Hoang

3
这是我为解决此问题所做的步骤。在你的/ckeditor/config.js文件中添加以下行:
CKEDITOR.timestamp = 'something_random'; 

每次插件更新时都要更新“something_random”。

在使用它的页面上,请确保以以下方式加载资源:

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

通过这样做,config.js文件将会被加载两次,因为CKEditor会自动加载它,但它仍然可以正常工作,这样你就可以控制所有浏览器的自动刷新。我是一名.NET开发人员,实际上我把/ckeditor/config.js文件放在我的打包程序中,所以它会自动获取查询字符串上的版本,但如果你没有使用高级打包程序,只需按照我上面说的手动进行?v=something_random操作即可。


3
对我来说,设置CKEDITOR.timestamp = +new Date非常好用。我把它写在了一个JS文件中,在任何其他CKEditor JS加载之前就会被加载(请参见我的自定义Drupal模块)。
现在,每次重新加载浏览器时,附加到自定义插件或自定义配置JS的查询都会刷新。我想这也可能适用于自定义CSS,但我没有测试过。

1
这段代码中含有“this will always refresh every ckeditor .js”的内容。你确定要为每个请求刷新每一个单独的JS文件吗?由于数量众多,这将会极大地拖慢页面的加载速度。 - giammin
@giammin - 当然,在开发完成后,您可以将其删除。 - leymannx
这很有意义 :D。无论如何,当我部署新的修改时,我需要一种刷新浏览器缓存的方法。 - giammin
@giammin - 像其他人之前所说的,我也不认为这是浏览器缓存问题。 - leymannx

2
我发现了一个更简单的方法,如果有人仍然对此感到沮丧,可以尝试以下方法。
在浏览器中打开带有时间戳(例如?t=XYZD)的配置文件URL,强制刷新它,然后返回应用程序页面并刷新它,您应该会得到配置文件的新版本。
您需要使用与页面源代码中由ckeditor设置的相同的时间戳。如果您使用开发人员工具或Firebug,在控制台中键入CKEDITOR.timestamp将为您提供要使用的值。

3
你认为这个对网站用户来说解释起来简单吗?主要的问题在于,当我上传一些更改时,客户端没有更新它们,新功能也无法使用,最糟糕的情况是CKEDITOR不能工作。 - giammin
我理解你的痛苦。我想你可以选择以下两种方式:1)将新配置URL的链接发送给他们,并告诉他们如何进行硬刷新;2)告诉他们如何删除浏览器缓存。 - Alfred Armstrong
谢谢,这对我很有帮助(使用 Laravel 的背包)。 - Brynn Bateman

0

你可以在你的URL中添加一个唯一的时间戳作为变量,或者进行硬刷新(CTRL + F5)


2
问题不在于页面URL,而是CKEditor动态加载的JavaScript文件。我无法要求每个站点用户刷新页面。 - giammin
为什么不行呢?当您编辑配置以添加功能时,浏览器应检测到配置文件已更改,并从服务器加载新的配置文件。或者您想在运行时重新加载配置文件,因为用户添加了一些内容到编辑器中吗? - Bas Tuijnman
你知道 CKEDITOR 如何加载它的文件吗? - giammin
快速查看ckeditor.js(或者您的页面的HTML)可以了解到它将脚本/CSS文件注入到文档头部。 - Bas Tuijnman
那么,页面或ckeditor.js中的时间戳如何可能会影响浏览器缓存这些文件呢? - giammin
1
真不可思议,有人给你的回答点赞。这与我的问题毫无关系。 - giammin

0

时间戳解决方案对我没有用,所以如果其他人有同样的问题,我在包含 ckeditor.js 的位置后面添加了 ?v=date,然后在 ckeditor.js 中引用 config.js 的位置再次添加了时间戳。

似乎由于 config.js 被缓存,新的时间戳不会被使用。至少在刷新几次之后才会生效,但这不是我能告诉我的用户要做的事情。


你是否在包含 ckeditor.js 脚本标签后立即设置了时间戳?如果您在此之后才这样做,可能会太晚。 - giammin
我已将其设置在 config.js 中。那么我需要在包含 ckeditor 之前设置时间戳吗? - Nick Zinger
1
在 config.js 中太晚了!ckeditor 已经加载了它的文件!你必须在 <script src="/ckeditor.js"></script> 之后设置它。 - giammin

0

由于这个帖子很受欢迎,让我分享一下我的经验 -

我尝试了@giammin的答案,但没有起作用。最终我将config.js的权限更改为664,然后它就像魔法般地工作了。


0

可行的方法是将配置和CSS文件改进后的CKEDITOR放入新的子目录:

src="/ckeditor_new_one/ckeditor.js"


0
将以下代码添加到 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');

然后在 ckeditor.js 中替换值为 timestamp:rString 的内容。


开发完成后,您可以删除randomNumber代码。 - Jawwad Ahmed
嗯,是的,我确实读过它们了。我的建议有什么问题吗?如果我错了,请纠正我。 - Jawwad Ahmed

-1

这个技巧在 Firefox 中不仅适用于 CKEditor,还适用于您想要切换本地缓存的任何页面。

  1. 打开 Firefox 调试控制台(F12)。
  2. 打开控制台设置(F1)。
  3. 启用“当工具箱打开时禁用 HTTP 缓存”。
  4. 保持控制台打开 :)

经过非常简短的检查,我没有在 Chrome 或 IE 中找到类似的设置。

希望能对您有所帮助


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接