強制瀏覽器每次重新載入 CSS, JS 檔


當網站的 CSS 及 Javascript (.css 及 .js) 作出修改後,這些更新可能不會立即呈現及訪客,這是因為瀏覽器為了提高開啟網站的速度,會將 .js 及 .css 檔儲存在快取內,下次進入網站時不會重新載入所致。

網站訪客可以清除網站的快取然後重新載入,便會看到新內容。但網站管理員總不能要求每個訪客這樣做,需要在網頁的層面解決。

一個簡單的解法是在 HTML 的 Meta Tag 加入控制快取的指示,例如:

但這個方法很多時都不會長時間有效。

另一個較簡單實用的方法是在檔名後面加上一個 GET 變數,這個 GET 變數可以是日期時間,也可以是版本號,例如:

當下次修改 CSS 或 JS 後,在網站的 HTML 修改這個版本號即可。

如果在 PHP 的網頁,可以用以下方法,每次自動定義一個新的 GET 變數:

如果網頁不是用 PHP 開發,可以用 Javascript 來完成:

但這個加上 GET 變數的方法也是有缺點的,因為每次都會重新載入 CSS 及 JS, 對伺服器產生較多連線,以及訪客會用多一點時間載入網頁,所以最好只選擇一些較常改動的 CSS 及 JS 檔使用。

Leave a Reply