2022-06-21 分類: 網站建設
前端構建工具滿天飛的情景下,筆者也忍不住去搗鼓了一下,真正體驗一下NODEJS帶來的魅力,經過一段時間規劃設計,終于將平臺工具搗鼓出來了。在里面也體驗了express, socket.io, grunt等node插件服務,使用很流暢,并且很好的完了我的基本需求(JS\CSS\IMAGE的壓縮和自動部署功能)。
雖然基本功能完成,但是還有一個讓人容易忽略而又重要的問題來了,就是資源文件的版本號的問題。在這里用的是SeaJS來做的模塊管理,也在網上搜集了一下關于這塊的資料。大致有以下兩種方案:
1、配置SeaJS的map對象。很方便,集中管理,但是也存在一些問題,比如:map對象的維護、配置文件引用頁面的時間戳問題。
2、生成文件sign,替換原有文件的名。這里不用考慮頁面引用的時間戳問題,但是需要對資源及頁面做一次全文查找替換,這對于分散部署的情況下將會非常復雜。
看了上面兩種方案后,感覺在我的場景下還存在一些不足之處。筆者想要的是不影響開發情況下,開發人員完全不用考慮文件被緩存問題,只需完成編碼,提交到構建系統后,一鍵完成構建和部署。
確定好目標后,既然不想讓開發同學關心時間戳問題,那么是否可以將這個工作交給Web服務器來做呢?那么交給服務器來做之后,如何動態的更新最新的資源文件呢?
有問題就好解決,將問題拋出來之后,方案也漸進呈現出來,不啰嗦了,直接上筆者的實現方案:
構建工具動態生成.htaccess文件,將構建的資源文件的URL重寫列表同步到.htaccess文件中以達到由服務器動態獲取新的資源文件。
(備注:筆者是在apache環境下,對IIS\NGINX\TOMCAT\RESIN\JBOSS等環境還需要再研究研究。)
看了上面的方案是不是很簡單,那具體是怎么做的呢?筆者也在這里列一下。
1. 構建工具在構的時候生成一個與filename.ext對應的filename.ext.sha1的文件,這個.sha1的文件存放filename.ext文件的sha1值。
2. 在構建完成后,構建工具讀取.htaccess的模板,并且遍歷得到所有資源文件的列表,生成一個對filename.ext對應的filename.ext.sign的文件。
3. 按規則生成RewriteCond和RewriteRule。并將規則數據寫到.htaccess文件中并部署到資源文件站點的根據目錄。
圖一:構建工具基本結構圖
圖二:構建后的文件列表
圖三:生成一條Rule
圖四:生成后的.htaccess文件
OK,到這里基本告一段落了,資源版本號解決了。但是對于性能影響這塊還需要觀察,待有時間再研究。
新聞標題:Web前端構建工具版本號管理方案思考
地址分享:http://m.newbst.com/news5/170255.html
成都網站建設公司_創新互聯,為您提供響應式網站、微信小程序、動態網站、云服務器、標簽優化、網站營銷
聲明:本網站發布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創新互聯
猜你還喜歡下面的內容