eggjs中cache-control相關問題


存在3個環境,dev,test,prod

針對每個環境有不一樣的config,其中dev為config.dev.js,test為config.test.js,prod則直接采用conf.default.js

其中:

1. 在dev和test下運行服務,前端獲取到js、css等靜態文件時,Request Headers沒有Cache-Control,或者存在時max-age=0

2. 在prod下運行的服務,Cache-Control為public max-age=31536000

對於prod環境,如果不主動給js、css等添加版本管理,這些文件的緩存時間將為1年,當更新任意文件后,瀏覽器會Cache-Control的存在,選擇從 memory cache 或者 disk cache中讀取,導致無法更新某些靜態資源,必須通過ctrl+F5這種操作來更新。

PS:未使用CDN

 

查看eggjs的官網,查看關於靜態資源的說明,使用了static。

 

 查看api中static的配置,默認如下:

 

 注意:

雖然此處寫着maxAge的默認值為0,但是實際上,查看egg-static在github中的說明會發現

Cache-Control,在prod環境下,l為public max-age=31536000,其他環境下,為max-age=0

 

而Egg在運行環境中,也有如下說明:

 

故而,在prod環境中,未指定任何EGG_SERVER_ENV時,框架自動設置該值為prod,導致egg-static讀取prod env下的配置

此時,通過在config中配置static即可解決問題

 

 

但是這樣配置,會導致,所有靜態資源都將跟服務器請求,頁面將變慢,解決方案:

1. 使用版本號,打包靜態資源,並使用開啟static,這樣,如果在瀏覽器有緩存,則不向服務器請求,這種情況下,速度最快。

PS:使用CDN也是通過cache-control來判斷緩存,如果使用CDN也需要主動管理靜態資源的版本,來保證靜態資源能夠按需更新

2. 使用etag,這種情況下,靜態資源在瀏覽器有緩存,但是,每一次都會跟服務器判斷,相同時返回304讀取緩存,不同時返回資源,並刷新緩存

此時,使用egg-etag即可,安裝egg-etag后,在plugins和config.default.js中配置即可。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM