原生整合react-native(二)-熱更新
使用code-push 和code-push-server 實現熱更新
1.安裝code-push-server:
npm install code-push-server -g
2.初始化mySQL資料庫:
code-push-server-db init --dbhost localhost --dbuser root --dbpassword
可以通過code-push-server-db --help檢視相關命令
注意:確保mySql服務已經啟動!
3.啟動code-push-server服務:
啟服務之前,修改config.js(路徑:/usr/local/lib/node_modules/code-push-server/config/config.js),以便本地測試. 僅修改db,local的內容:
4.終端輸入:code-push-server 啟動服務, 瀏覽器開啟http://localhost:3000 賬號:admin 密碼:123456
登入來獲取token
5.安裝code-push:(也可以獲取token)
npm install code-push-cli -g
code-push login http://127.0.0.1:3000
(如果服務不是搭建本機,填寫伺服器地址http://IP:3000,預設埠3000)
把獲取的token 複製貼上上 ,如果輸出 :Successfully logged-in 就行了 ,接下來就是新增app了
6.先了解下code-push 相關命令:
code-push app add 相關命令:
7.在Code-Push伺服器上註冊自己的app:(我的應用名稱:android)
code-push app add android android react-native
獲取部署到伺服器的key(預設使用Staging)
8.在原生android專案裡整合code-push:
8.1: npm install react-native-code-push
可以看到node_modules/react-native-code-push下檔案目錄
8.2:將codepush包和codepush.gradle複製到自己的專案路徑下然後修改路徑包名等錯誤資訊
同時在libs下新增:nimbus-jose-jwt-5.1.jar 包
8.3:在app/build.gradle(或者Library/build.gradle)中新增
apply from: "../node_modules/react-native/react.gradle"
apply from: "./codepush.gradle"
8.4:為了在原生專案裡以單獨的庫使用rn,可以直接在容器裡新增codePush模組,
新增deploymentKey和本地伺服器地址.
CodePush.getJSBundleFile() , bundle檔案的從預設路徑()獲取.
9. 在 android/app/build.gradle中有個 android.defaultConfig.versionName屬性,我們需要把 應用版本改成 1.0.0(預設是1.0,但是codepush需要三位數).
android{
defaultConfig{
versionName "1.0.0"
}
}
10.在第一個js頁面中觸發更新
9.通過react-native bundle命令打離線包
9.1 老版本bundle路徑(lib-rn/src/main/assets)
react-native bundle --platform android --dev false --entry-file index.js --bundle-output lib-rn/src/main/assets/index.android.bundle --assets-dest lib-rn/src/main/res/
註釋:
lib-rn/src/main/assets/index.android.bundle (老版本bundle包的資源地址)
--entry-file index.js :入口js可以寫成自己的
--bundle-output :bundle包的輸出路徑 src/main/assets
9.2新版本的bundle包直接放到工程下的bundles檔案下(如果沒有,mkdir bundles)
react-native bundle --platform android --entry-file index.js --bundle-output ./bundles/index.android.bundle --dev false
10 釋出更新:
10.1可以先了解下code-push release相關命令:
這是我的輸入:
code-push release android ./bundles 1.0.2
釋出更新成功.
注意:
- CodePush預設是更新 staging 環境的,如果是staging.
- 如果有 mandatory 則會讓客戶端強制更新
- 對應的應用版本(targetBinaryVersion)是指當前app的版本,而不是你填寫的更新版本。譬如客戶端版本是 1.0.0,如果我們需要更新客戶端,那麼targetBinaryVersion填的就是 1.0.0。
11.通過code-push deployment history android Staging 命令檢視歷史版本
:code-push deployment ls android -k (產看已經部署的app的key)
JS API
CHECKFORUPDATE
詢問伺服器是否有新版本。譬如:
CodePush.checkForUpdate() .then( (update) =>{ if( !update ){ console.log("app是最新版了"); }else { console.log("有更新哦"); } });
GETCURRENTPACKAGE
獲取當前已安裝更新的元資料(描述、安裝時間、大小等)。譬如:
CodePush.getCurrenPackage() .then( (info) =>{ console.log(info); })
NOTIFYAPPLICATIONREADY
通知CodePush程序,一個更新安裝好了,當檢測並安裝更新,這個方法必須被呼叫。
否則在app重啟時,Codepush會認為update失敗,並回滾版本。
當使用 sync方法時,不需要呼叫此方法,因為它會預設呼叫
RESTARTAPP
立即重啟App
SYNC
允許檢測更新,下載並安裝。除非我們需要自定義UI表現,不然直接用這個方法就可以了。
注意
- CodePush只能更新 js或圖片,原生程式碼的改變(二進位制打包)是不能通過它更新的。
資源地址: