防止缓存 iframe src 中的外部文件（使用 CloudFlare）

Question

我正在努力打造一个像 plunker 一样的游乐场。我刚刚注意到一个非常奇怪的生产行为（在 Cloudflare 中使用 active mode），而它在 localhost.

中运行良好

到 iframe，playground 预览 index_internal.html，其中可能包含指向其他文件的链接（例如，.html、.js、.css）。 iframe 能够解释外部链接，例如 <script src="script.js"></script>.

因此，每次用户在编辑器上修改他们的文件（例如，script.js）时，我的程序都会将新文件保存到服务器上的一个临时文件夹中，然后通过 iframe.src = iframe.src 刷新 iframe , 它在 localhost.

上运行良好

然而，我意识到，在生产中，浏览器总是不断地加载 initial script.js，即使用户在编辑器中修改它并且新版本是写在服务器的文件夹里。比如我在Dev Tools ==> Network中看到的总是script.js的初始版本，而我可以通过左侧的less查看服务器中保存的新版本script.js手.

有谁知道为什么会这样？以及如何修复它？

编辑 1：

我尝试了以下方法，但不适用于 script.js：

var iframe = document.getElementById('myiframe');
iframe.contentWindow.location.reload(true);
iframe.contentDocument.location.reload(true);
iframe.contentWindow.location.href = iframe.contentWindow.location.href
iframe.contentWindow.src = iframe.contentWindow.src
iframe.contentWindow.location.replace(iframe.contentWindow.location.href)

我尝试添加一个版本，它适用于 index_internal.html，但没有重新加载 script.js:

var newSrc = iframe.src.split('?')[0] 
iframe.src = newSrc + "?uid=" + Math.floor((Math.random() * 100000) + 1);

如果我将 Cloudflare 转为 development mode，script.js 会重新加载，但我确实希望将 Cloudflare 保留在 active mode。

Answer 1

我找到了。

我们可以在 CloudFlare 中创建自定义缓存规则：

https://support.cloudflare.com/hc/en-us/articles/200168306-Is-there-a-tutorial-for-Page-Rules-#cache

例如，我可以将文件夹 www.mysite.com/tmp/* 的 Bypass 设置为 Cache Level。

防止缓存 iframe src 中的外部文件（使用 CloudFlare）

Prevent external files in src of iframe from being cached (with CloudFlare)

caching

iframe

browser-cache

cloudflare

html-head