1. 程式人生 > >互聯網企業靜態資源的部署,如何充分利用瀏覽器緩存機制

互聯網企業靜態資源的部署,如何充分利用瀏覽器緩存機制

本地 客戶 方式 sta blog scss tro 利用 exp

瀏覽器獲取靜態資源方式:緩存、版本

從html文件中解析出靜態資源的url,查看本地緩存是否存在、是否過期,是否需要重新獲取。根據url全路徑匹配查找是否存在,根據header的字段expire/cache-control等判斷是否過期。

所謂版本信息,不過是靜態資源url的一部分信息,通過修改服務器html裏靜態資源的版本信息,達到修改靜態資源url路徑的目的,從而實現客戶端瀏覽器重新下載靜態資源的目的。

版本示例:http://xx.x.x.x:8083/static/dll/vendor1.js?v=1534689158

關於版本信息內容的良好實踐:根據靜態資源的hash值生成版本號,這樣靜態資源變化,則版本號變化,從而引起客戶端瀏覽器的重新下載

對於react項目使用webpack編譯輸出文件的過程中,可以生成帶hash值的文件。文件變化,則hash值變化。

flask的靜態資源文件插件:https://pythonhosted.org/Flask-Versioned/

或者使用flask的jinja2模板自帶的模板過濾功能,自動給靜態文件添加版本號。版本號為文件的修改時間。這樣靜態資源只要修改,則靜態資源的版本號發生變化。其實最好還是使用靜態資源的hash值比較好。畢竟文件的修改時間也是可以人為構造的。https://ana-balica.github.io/2014/02/01/autoversioning-static-assets-in-flask/

參考:

1、http://www.cnblogs.com/ihardcoder/p/5623411.html

2、https://zhuanlan.zhihu.com/p/24954527?refer=jscss

3、https://blog.csdn.net/u014590757/article/details/80140654

4、https://www.zhihu.com/question/20790576

5、https://blog.csdn.net/vencent7/article/details/77621212

6、https://ana-balica.github.io/2014/02/01/autoversioning-static-assets-in-flask/

互聯網企業靜態資源的部署,如何充分利用瀏覽器緩存機制