cordova打包app熱更新問題

定義: 基於 cordova 框架能將web應用 (js, html, css, 圖片等) 打包成 App。當 App 在終端上安裝後,不需要重新下載app,實現內殼更新。

原理:1.在項目根目錄的config.xml文件中添加指向服務器的地址

            2.在www目錄中添加chcp.json配置文件,配置指向服務器,更新時間,更新方式

步驟:(進入項目目錄)

1、在cordova項目下添加熱更新插件  cordova-hot-code-push

cordova plugin add cordova-hot-code-push-plugin  命令

(安裝插件後可以看到項目根目錄增加了cordova-hcp.json。我的內容如下:)

           {
                            "name": "test",               // 可爲空
                            "autogenerated": true,   //必須項,否則熱更新無法使用(需手動添加)
                            "ios_identifier": "",          //應用在Apple Store id(可不填)
                            "android_identifier": "",   //應用在應用商店上的地址或app下載地址(可不填)
                            "update": "start",            //在應用啓動時安裝
                            "content_url": "http://192.168.0.114:8080/ptzy/www"    //www文件在服務器上的地址
                       }

update可選值:

  • start:應用啓動,默認項(install update when application is launched)
  • resume:應用從後臺恢復(install the update when application is resumed from background state)
  • now:下載更新後立即執行(install update as soon as it has been downloaded)

2、添加熱更新工具  cordova-hot-code-push-cli

npm install -g cordova-hot-code-push-cli  命令

3、藉助 cordova-hot-code-push-cli 工具在www目錄下生成chcp.json和chcp.manifest文件:

執行 cordova-hcp init 命令

          Application config:chcp.json 包含發佈相關信息:熱更新代碼版本號,應用 native side 版本號等等(描述了熱更新代碼的版本信息)

           Content manifest:chcp.manifest 包含項目熱更新代碼(靜態)文件信息:文件名和文件哈希值(提供了熱更新代碼文件的變更信息)

4、config.xml 配置

在<widget>元素下添加如下:

 

  • auto-download:是否自動下載熱更新代碼,默認是 true
  • auto-install:是否自動安裝熱更新代碼,默認是 true
  • native-interface:當前 native side 的版本號
  • config-file:配置文件 chcp.json 從服務器上加載的路徑(必須的配置項)

5、cordova-hcp build

           執行該命令會在chcp.json文件中增加"release":"當前時間"字段。

(默認使用時間戳,格式爲:yyyy.MM.dd-HH.mm.ss),插件將版本號進行字符串相等比較來判斷是否存在新版本。

6、cordova build 打包安裝app

7、測試更新

例:修改cordova項目下的html內容或js中alert("測試內容")後,執行步驟5命令,然後將項目下的www文件上傳至content_url 配置的服務器文件路徑下,重新打開app即可。

以下是檢測文件修改,執行cordova-hcp server命令,如下:

當cordova中有文件修改時會輸出文件信息,如下:

注:該方法爲本人親測實現,僅代表本人觀點。如有講述不清或其他問題,請留言,謝謝!

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章