2013-01-16 48 views
6

我有一個在hostgator上運行的應用程序。當我更改js文件時,用戶在清除緩存之前不會看到更改。這是將更改推送到我的應用程序的唯一選項嗎?基本上,我應該進行更改,更新文件,然後請求所有用戶清除緩存?如何在下次登錄時清除客戶端緩存

回答

10

您需要使用文件包含的版本控制。無論何時,如果您更改文件包含的URI,瀏覽器將無法找到緩存匹配項,並會重新下載這些包含項。

例如:

<script type="text/javascript" src="include/232/init.js"></script> 

其中232是當你發佈新代碼應改變您的修改版本號。

或者,您可以使用查詢字符串:

<script type="text/javascript" src="include/init.js?232"></script> 

的一點是,你應該改變的文件包括:URI中,每當你想你的訪問者重新下載文件中的一些方式。

如果您使用PHP或其他服務器端語言,你可以設置到時,您的文件包括修改自動發生這樣的版本:http://derek.io/blog/2009/auto-versioning-javascript-and-css-files/

3

您可以將虛擬的查詢字符串的URL資產:

<link href="http://mysite.com/main.css?v=1" rel="stylesheet" /> 

然後,只要你對CSS的任何變化,只是撞了版本號。

該技術被稱爲緩存破壞Search Google for that,你會得到很多不同的變化。

2

一個技巧來解決這個問題是一個查詢字符串附加了某種版本或時間戳到您的link Javascript調用。例如:

<script src="myexternal.js?20130116" type="text/javascript"></script> 

這個例子很簡單,但證明了一點。基本上這告訴瀏覽器加載該文件,如果它不能識別完整的路徑。任何時候當你改變你的JavaScript文件並希望你的用戶使用最新版本時,只需在問號(查詢字符串)後面更新該時間戳或值即可。

2

你不能清除你的客戶的瀏覽器緩存,但你可以使用緩存清除技術,如添加版本將您的文件

<link rel="stylesheet" href="/css/example.css?v1.0" type="text/css" /> 

然後當你改變

<link rel="stylesheet" href="/css/example.css?v1.1" type="text/css" /> 

它可以是一個時間戳或其他什麼,只需要有所不同。

1

我使用的一個簡單的技巧有時是爲JavaScript/CSS文件的路徑添加一些虛擬參數。瀏覽器本質上會看到一個不同的URL,並且不會使用它的緩存版本。

$jsFile = '/js/myFile.js';    // probably cached 
$jsFile = '/js/myFile.js?r='.time();  // won't ever be cached 

你不能真正清除客戶緩存,但你可以欺騙客戶端瀏覽器到以爲,這是它第一次是看到這個文件,它會重新下載。

不要忘記一旦你到達一個穩定版本就禁用它。緩存文件是加速應用程序加載時間的好方法。

1

我用來避免這個問題的技巧是修改更新腳本的網址。這將強制客戶端再次下載腳本,因爲資源名稱不同。

最簡單的方法:使用url js/my-script.js?v=1.0末尾的版本號。

更好的辦法做到這一點(100%支持所有導航器):更改文件名本身js/my-script.v1.0.js

+0

爲什麼第一個不是100%支持? – Ian

+0

似乎在靜態資源上添加了一個查詢字符串[防止在某些代理上緩存](http://www.mikebrittain.com/blog/2009/06/11/caching-urls-with-query-strings/)。我們希望能夠在某個時間點清除緩存的文件版本,而不是完全阻止緩存機制。但是,如果你不是表演專家,那麼第一個解決方案非常棒。這是用於Wordpress主題的。 –

+0

嗯非常有趣,謝謝你提供的鏈接。雖然我不認爲Squid被用在瀏覽器中(正如你指出的那樣,只是代理服務器)。所以,雖然能夠在每個地方「誘騙」緩存會很好,但是在你想要的時候,最重要的是欺騙瀏覽器......所以使用查詢字符串應該不成問題。雖然在文件名中嵌入「版本」並使用重寫規則非常聰明......我會考慮一些我自己的東西。 – Ian