2012-08-28 53 views
3

所以我实现了这个js/css版本控制方案,我基本上追加了js/css文件的校验和。我正在考虑的策略是,基本上得到这个校验和值,然后计算文件的校验和(假设它可能来自缓存),如果它们匹配,那么客户端有最新的文件,如果不是那么客户端浏览器将强制从服务器下载该特定文件。这种方法是否正确? 另外,我想了解脚本标记的行为,就像脚本标记的src attr一样,首先转到js文件的缓存或直接转到Web服务器?需要关于如何实现js/css版本的建议

谢谢

+2

不会将文件的校验和附加到文件更改文件的校验和? – PitaJ

回答

2

嗯,它在现实生活中很简单。您向JavaScript文件名称附加了一些独特的校验和(您不必更改文件本身),并在HTML文件中使用该全名。当浏览器请求这个.js文件时,您在将来使用Expires标题(通常为一年),以便浏览器缓存此文件“永远”。看看该网站的源您现在使用:

<script src="http://cdn.sstatic.net/js/stub.js?v=aa8b9e2e0673" type="text/javascript"></script> 
<link href="http://cdn.sstatic.net/stackoverflow/all.css?v=ffb907d7e663" rel="stylesheet" type="text/css"> 

(SO使用由@machineghost这里描述的技术)。

只要您不更改.js文件,其校验和和文件名相同,并且浏览器没有任何操作。该文件被缓存,你说它在一年内不会改变。那么你如何改变它?那么,每次修改文件时,校验和都会改变。浏览器看到一个不同的.js文件,并被迫下载它。以前的文件是没用的,但浏览器会保留一年(我们不在乎)。

这种方式可以结合积极的缓存和快速变化的脚本标签的

SRC ATTR(浏览器缓存旧JavaScript,但使用新的HTML等没有问题),进入到高速缓存第一个为js文件

是的,如果此JavaScript文件已被下载,浏览器将使用缓存。这实际上有点复杂。如果您上次返回Expires标题,浏览器甚至不会触摸您的服务器。如果您只返回了Last-Modifed标题,浏览器将发出所谓的条件GET - 如果文件更改,服务器将只返回新内容,否则将返回304 Not Modified

+0

“以前的文件没用,但浏览器会保留一年(**我们不关心**)。”哈哈,现在我明白为什么浏览器的缓存太大了...... – Oriol

+0

@Oriol:好吧,缓存不会无限增长。每个优秀的浏览器都会让您自定义最大缓存大小,并使用一些启发式方法移除最旧/最少使用的项目。 –

+0

谢谢你,这真的很有帮助。 – user1386101

2

Tomasz砸在头上...除了有一个更简单的解决方案:-)不要更改文件的文件名;只是改变他们的链接,特别是“搜索”部分。而你并不真的需要一个校验和,也可以换句话说使用一个递增的数字或当前版本号在你的源代码控制系统

所以:

<script src='myFile.js'/> 

是:

<script src='myFile.someChecksum.js'/> 

正如托马斯所描述的那样;相反,如果你这样做:

<script src='myFile.js?x=someChecksum'/> 

浏览器仍然会认为这是一个新文件(校验和更改时),但你不必每次更改文件名。如果使用版本号,则不必每次计算校验和,只需要服务器端逻辑即可:

<script src='myFile.js?x={{currentRevisionNumber}}'/> 
+0

+1,刚注意到SO-guys正在使用这种方法,而不是更改文件名。 –

+0

好的,万分感谢。但是我想知道,不会像我在问题中提到的一样,因此不会是客户端? – user1386101

+0

我不确定你的意思是“逻辑”。有涉及服务器端和客户端的逻辑。在服务器端,您需要您的服务器代码(Python,Ruby,PHP等)来生成发送给客户端的HTML文件;只有你的服务器端知道你的版本号或你的校验和。一旦服务器发送带有“foo.js?x = 12345”脚本标签的html文件,就有用户的浏览器根据它在HTML中看到的内容。 – machineghost