java web js加版本号_给js加版本号解决浏览器缓存问题

本文讲述了在Java Web开发中,为了解决浏览器缓存导致的更新内容无法立即显示的问题,作者通过给JS文件添加版本号来强制浏览器重新加载。文中详细介绍了两种方法:使用随机数和时间戳,并讨论了使用`document.write()`的潜在问题及其解决方案。
摘要由CSDN通过智能技术生成

我们知道打开网页时浏览器会加载需要的资源,比如图片、音频、js文件、css文件等。并且会把这些资源作为缓存保存下来,再次打开网页时缓存好的资源就不需要再次加载了。但是,这样有一个问题,就是当程序猿更新了网页内容后,因为浏览器缓存的存在,可能没有办法显示出更新后的内容。

今天我就遇到了这样的问题,做了一个小游戏的网页,用到了大量的图片和音频,测试时更新的js不能立刻反馈,总是需要清除缓存后刷新才能看到更新。但是大量的图片和音频,每次都需要清除缓存也太麻烦了,我就百度了一下有没有好的解决方法。

百度找到的解决方案就是给js添加版本号,这样每次更新版本号,浏览器就会重新加载js文件,如下:

document.write('

通过随机数来自动添加版本号,不需要自己手动去添加,实在是省时省力!

不过,考虑到随机数有重复的可能性,即便两次随机数正好一样的可能性及其微小,也不为0,而且随机数也不够直观,不如直接使用时间戳,如下:

document.write('

永远不会停止流动的时间不可能重复,更何况还精确到了毫秒,而且时间戳也总比随机数更加明了,可以明确知道js版本的先后。

使用上述方式改了我的程序后,成功避免了缓存问题,不过打开控制台后,发现了新的问题......

1688121-20190619114420798-2075634246.png

谷歌浏览器对document.write()发出了警告,查看了谷歌浏览器的警告页,了解到了使用document.write()方式链接js文件会导致加载变慢,对网速不好的用户体验会变差,不过谷歌举的例子是使用2g的用户。

???

现在还有使用2g的史前人类吗?本来想无视这个警告,不过往下看后发现...谷歌浏览器在55版本之后,对于网速不好的用户,会禁止document.write()方式链接的js文件,范围扩大到了3g和状况不好的wifi...

这已经是不能忽视的情况了。

想到的解决方法如下:

var scripts = document.getElementsByTagName("script");for(var i = 0;i < scripts.length;i ++){if(scripts[i].src){

scripts[i].src= scripts[i].src+"?t="+newDate().getTime();

}

}

添加一段代码,动态添加时间戳。但是这样做有个弊端,可能会使浏览器加载两次js文件。

暂时没有想到更好的办法,先这样,有更好的办法再补充。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值