css、js或圖片變更後,看不到新設計的解決方法

網站伺服器沒有加掛CDN(Content Delivery Network)前,變更CSS、JS或圖片後如果看到還是舊頁面時,通常只要清除本機瀏覽器的Cache再刷一次頁面就OK了。大部份瀏覽器在視窗關閉重開再進入後通常就會從網站抓最新版本,若還不行就進入瀏覽器設定清除Cache即可,瀏覽器太多就不在此介紹。

網站伺服器如果加掛CDN(Content Delivery Network),即時清除本機Cache看到仍是舊頁,天啊~頁面刷到地老天荒還是舊的。

因為CDN一項特性就是加速頁面顯示,為達成加速效果,網站伺服器上js、 css和圖片若檔名沒變更時CDN節點就可能不會重新抓取。

有些CDN會提供API或在後台清除節點緩除的功能,但有些CDN像CloudFare就沒有提供,API和後台清除節點緩除操作起來可能有些麻煩,有時CDN管理和WEB內容管理可能不是同一人。

最簡單的方法就是在css、js和img檔案後面加上?v=版本參數,會比變更檔名快又有效。當這些檔案有變動時,只要變更版本參數,通常都用時間來管理版本參數,黑黑黑,前端就可立刻看到新設計。

  • <link href="css/style.css?v=2017011301" media="screen" rel="Stylesheet" type"text/css" />

在CloudFare用這個方法是OK的,如果所用的CDN並不支持uri加參數時這方法就行不通哦,聽說大陸有些CDN就不支持。

2017-01 台中麗寶Outlet Mall 號稱全台最大的摩天輪 - 還沒完工

這個網誌中的熱門文章

沒印表機沒關係 便利商店找印去

被時代淘汱的英文怎麼說

探訪神秘的烏法魯神殿

色情廣告視窗關不掉? 動手解解看吧~

玩轉水晶石工作室 妝點個人部落