成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

Hybird-離線資源生成工具

siberiawolf / 2275人閱讀

摘要：為了滿足以上需求，就需要制作打包腳本和工具，來滿足正常的運(yùn)維。離線資源生成工具離線資源的生成，我們提供了一個(gè)工具可以打包出增量和全量升級包。比如和需要統(tǒng)一成。

目錄 
背景


離線資源生成工具


前端協(xié)助
背景

由于線上樂刻客戶端 App 第一次打開平臺(tái) H5 需要幾秒的加載時(shí)間，這個(gè)體驗(yàn)對用戶來說并不友好，為了讓用戶跳轉(zhuǎn) H5 和跳轉(zhuǎn)到原生一樣的用戶體驗(yàn)，就需要把 H5 相關(guān)的離線資源包下發(fā)給客戶端，客戶端就可以使用離線資源來代替實(shí)際網(wǎng)絡(luò)請求，節(jié)省用戶等待時(shí)間和流量消耗。為了滿足以上需求，就需要制作打包腳本和工具，來滿足正常的運(yùn)維。

離線資源生成工具

離線資源的生成，我們提供了一個(gè)工具可以打包出增量和全量升級包。原理是根據(jù) git diff 去比較兩次 commit，然后只關(guān)注 offlineResource (與 dist 目錄平級，發(fā)布包需要把 dist 目錄內(nèi)容拷貝到 offlineResource) 目錄下的兩次提交的文件差別，從而打出增量包。全量包就是整個(gè) offlineResource 目錄。

offlineh5 安裝方法：

npm install -g offlineh5

使用方式：

offlineh5 -o package -r  http://github.com/xxx.git -f e24b8f0bb9a85c93c6965a906c1ea0448342821a -u gitusername -p gitpassword -z activity

參數(shù)說明：

-o 資源包輸出路徑
-r 倉庫地址
-u git 用戶名
-p git 用戶密碼
-f 從哪個(gè) commit 導(dǎo)出增量包
-z 打出來的資源包前綴

打出來的離線資源包需要放到七牛 cdn 存儲(chǔ)：

http://oq78hrbgk.bkl.clouddn.com/upgrade/activity/activity.full_0.1.1.zip
前端協(xié)助 遇到的問題

之前前端打包只把 html, js, css 導(dǎo)出到 offlineResource 目錄下，沒有圖片，因?yàn)閳D片都放在 cdn 上，本地就沒有任何的原始圖片，這樣導(dǎo)致三個(gè)問題：

node 腳本打出來的離線資源包并不包含圖片。

即使找到了原始圖片，并不能保證原始圖片的本地路徑和cdn上的是一致的。

線上現(xiàn)有 cdn一級路徑比較混亂。

線上現(xiàn)有路徑。

http://cdn.leoao.com/le-activ...
http://cdn.leoao.com/activity...
http://cdn.leoao.com/activity...
前端調(diào)整

使用 qtool 腳本獲取 cdn 上的所有圖片，存放到本地作為原始圖片，根據(jù)模塊規(guī)范原始圖片的路徑。比如 le-activity 和 activity 需要統(tǒng)一成 activity。

前端打包不僅輸出 html, js, css，同時(shí)每次打包需要把原始圖片拷貝到 dist 目錄下。同時(shí)發(fā)布流程需要把 dist 目錄內(nèi)容拷貝到 offlineResource目錄下。

根據(jù) offlineResource 目錄，使用 qtool 腳本使用該目錄下的所有資源路徑作為 cdn key，然后把所有資源上傳到 cdn 上。以后前端在打包之前開發(fā)的時(shí)候，完全可以使用本地的路勁作為相對路徑提前配置路徑，而不用考慮 cdn 的上傳路徑問題。

調(diào)整后，offlineh5 打包腳本可以根據(jù) offlineResource 目錄下的不同的 commit，diff 出兩個(gè)版本之間差別，從而打出增量包和全量包。

使用 qtool

qtool 安裝方法：

npm install -g qtool

上傳資源:

qtool upload  -f uploadfolder -a RSxpQIxNIS2vo0vuQR3HX701ddS9fdlUnQ5jV8ul -s xCLWczC5V5kyy7H85MNKNYcXT4wx9k5OzT7YDVFk -b mybucket -k activity -h olf3t4olk.bkt.clouddn.com

下載資源:

qtool download  -f downloadfolder -a RSxpQIxNIS2vo0vuQR3HX701ddS9fdlUnQ5jV8ul -s xCLWczC5V5kyy7H85MNKNYcXT4wx9k5OzT7YDVFk -b mybucket -k activity -h olf3t4olk.bkt.clouddn.com

參數(shù)說明:

-f, --folder  
    上傳和下載目錄
    
-k, --keypreffix  
    上傳的時(shí)候，前綴會(huì)插入到 key 的前面。
    下載的時(shí)候，前綴會(huì)被用于過濾七牛的cdn url。
    
-a, --accessKey 
    access Key 七牛官網(wǎng)獲取
    
-s, --secretKey  
    Secret Key 七牛官網(wǎng)獲取
      
-b, --bucket 
    上傳和下載對象空間
    
-h, --hostUrl 
    七牛 host url，比如：http://cdn.xxx.com

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/23027.html

相關(guān)文章

  • Hybird-離線資源生成工具

    摘要：為了滿足以上需求，就需要制作打包腳本和工具，來滿足正常的運(yùn)維。離線資源生成工具離線資源的生成，我們提供了一個(gè)工具可以打包出增量和全量升級包。比如和需要統(tǒng)一成。 目錄 背景 離線資源生成工具 前端協(xié)助 背景 由于線上樂刻客戶端 App 第一次打開平臺(tái) H5 需要幾秒的加載時(shí)間，這個(gè)體驗(yàn)對用戶來說并不友好，為了讓用戶跳轉(zhuǎn) H5 和跳轉(zhuǎn)到原生一樣的用戶體驗(yàn)，就需要把 H5 相關(guān)的離線資源...

    hedge_hog 評論0 收藏0

  • Hybird-離線資源生成工具

    摘要：為了滿足以上需求，就需要制作打包腳本和工具，來滿足正常的運(yùn)維。離線資源生成工具離線資源的生成，我們提供了一個(gè)工具可以打包出增量和全量升級包。比如和需要統(tǒng)一成。 目錄 背景 離線資源生成工具 前端協(xié)助 背景 由于線上樂刻客戶端 App 第一次打開平臺(tái) H5 需要幾秒的加載時(shí)間，這個(gè)體驗(yàn)對用戶來說并不友好，為了讓用戶跳轉(zhuǎn) H5 和跳轉(zhuǎn)到原生一樣的用戶體驗(yàn)，就需要把 H5 相關(guān)的離線資源...

    J4ck_Chan 評論0 收藏0

  • Hybird-App離線緩存系統(tǒng)

    摘要：表示備份過程正常，否則備份過程有錯(cuò)誤。此時(shí)請求不走緩存系統(tǒng)。升級流程圖離線資源緩存使用緩存時(shí)機(jī)只針對的以為主域名的請求進(jìn)行攔截，然后根據(jù)請求鏈接，找到具體文件緩存。 目錄 背景 接口格式 離線資源包格式 離線資源下發(fā) 離線資源緩存 背景 由于線上樂刻客戶端 App 第一次打開平臺(tái) H5 需要幾秒的加載時(shí)間，這個(gè)體驗(yàn)對用戶來說并不友好，為了讓用戶跳轉(zhuǎn) H5 和跳轉(zhuǎn)到原生一樣的用戶體驗(yàn)...

    gself 評論0 收藏0

  • Hybird-App離線緩存系統(tǒng)

    摘要：表示備份過程正常，否則備份過程有錯(cuò)誤。此時(shí)請求不走緩存系統(tǒng)。升級流程圖離線資源緩存使用緩存時(shí)機(jī)只針對的以為主域名的請求進(jìn)行攔截，然后根據(jù)請求鏈接，找到具體文件緩存。 目錄 背景 接口格式 離線資源包格式 離線資源下發(fā) 離線資源緩存 背景 由于線上樂刻客戶端 App 第一次打開平臺(tái) H5 需要幾秒的加載時(shí)間，這個(gè)體驗(yàn)對用戶來說并不友好，為了讓用戶跳轉(zhuǎn) H5 和跳轉(zhuǎn)到原生一樣的用戶體驗(yàn)...

    1treeS 評論0 收藏0

發(fā)表評論

0條評論

最新活動(dòng)
閱讀需要支付1元查看
<