0

我需要将时间戳附加到标记 url 中的 javaScript 文件以避免缓存。

在stackoverflow中找到的这个函数似乎可以做到:

<script type="text/javascript">
(function(){ 
 var randomh=Math.random();
 var e = document.getElementsByTagName("script")[0];
 var d = document.createElement("script");
 d.src = "TESTINGX.JS?x="+randomh+"";
 d.type = "text/javascript"; 
 d.async = true;
 d.defer = true;
 e.parentNode.insertBefore(d,e);

})();

但问题是在 testingx.js 文件中,我放置了以下代码:

var hello = "Hello World!";

并且由于某种原因,该变量没有获得全局范围(或​​者问题可能是其他问题)。

我的html如下:

<!DOCTYPE html>
<HTML><HEAD>

<script type="text/javascript">
(function(){ 
     var randomh=Math.random();
     var e = document.getElementsByTagName("script")[0];
     var d = document.createElement("script");
     d.src = "TESTINGX.JS?x="+randomh+"";
     d.type = "text/javascript"; 
     d.async = true;
     d.defer = true;
     e.parentNode.insertBefore(d,e);
 })();
</script>

</HEAD><BODY>

<h1>WiFi Mini Web Server</h1>

<script>
document.write(hello); //hello var is contained in the TESTINGX.JS file\n\
</script>
</BODY></HTML>
4

3 回答 3

2

您为缓存清除编写代码,也恰好确保脚本以“惰性”、“非阻塞”方式加载。这意味着在您的 DOMTESTING.js加载后加载。这也意味着document.write脚本在 js 文件加载之前运行,并将所需的 var 添加到全局范围。

可以有几种解决方案: 1.从您的加载脚本中删除deferasync

  1. 确保仅在实际加载脚本后才能在页面上访问脚本中的变量

  2. 更好的是,不要尝试通过聪明的 javascript 来处理缓存破坏(我假设 html 问题是使用某种服务器技术(如 jsp 或 php 脚本)提供的)。使用服务器技术在html中常用的script标签中添加一个带有随机数或时间戳的参数

  3. 不要使用脚本来破坏缓存,而是使用普通的脚本标签,其参数与以毫秒为单位的时间戳相同,就像您进行构建的那一天一样,并嵌入到您的微控制器/服务器中。将其视为 js 文件的版本号。因此,只要版本号是最新的,客户端就可以使用缓存在浏览器中的文件。

这个蚂蚁任务http://code.google.com/p/ant-web-tasks/wiki/CacheBusting是实现第 4 点的好方法。我有很好的经验。

希望这可以帮助。

于 2013-04-20T17:27:27.987 回答
2

如果您希望外部脚本在加载之前阻止其他所有内容,但仍需要从动态 URL 加载它(听起来像您这样做),您应该能够document.write直接使用脚本元素而不是使用 DOM 方法。

<!DOCTYPE html>
<html><head>

<script>
var randomh = Math.random();
document.write('<script src="TESTINGX.JS?x=' + randomh + '"></' + 'script>');
</script>

</head><body>

<h1>WiFi Mini Web Server</h1>

<script>
document.write(hello); // hello var is contained in the TESTINGX.JS file
</script>

</body></html>

http://jsbin.com/ixagud/2/edit

于 2013-04-20T17:55:25.137 回答
1

尝试这个

    <script type="text/javascript">
(function(){ 
     var randomh=Math.random();
     var e = document.getElementsByTagName("script")[0];
     var d = document.createElement("script");
     d.src = "TESTINGX.JS?x="+randomh+"";
     d.type = "text/javascript"; 
     d.async = true;
     d.defer = true;
     e.parentNode.insertBefore(d,e);
document.write(hello);
 })();
</script>
于 2013-04-20T17:04:03.793 回答