推薦:《》
使用 uni-app
開發跨終端應用,可將程式碼編譯到iOS
、Android
、微信小程式等多個平臺,升級時也需考慮多平臺同步升級。其中,uni-app
釋出為小程式的升級模式較簡單,只需將開發完的程式碼提交小程式後臺,待稽核通過後使用者將自動升級。
HBuilderX 1.6.5
起,uni-app
支援生成 App
資源升級包wgt
。
首先,更新 manifest.json
中的版本號。
比如之前是 1.0.0
,那麼新版本應該是 1.0.1
或 1.1.0
這樣。
然後,在 HBuilderX
中生成升級包(wgt
)。
選單->發行->原生App-製作移動App資源升級包
生成結束會在控制檯告知升級包的輸出位置。
應用的升級需要伺服器端與使用者端配合完成,下面以本地測試過程中的操作舉例說明:
存放資源
將 %appid%.wgt
檔案存放在伺服器的 static
目錄下,即 http://www.example.com/static/UNI832D722.wgt
。
伺服器端介面
約定檢測升級的介面,地址為:http://www.example.com/update/
傳入引數
name
String ‘’ 使用者端讀取到的應用名稱,定義這個引數可以方便多個應用複用介面。version
String ‘’ 使用者端讀取到的版本號資訊返回引數
update
Boolean false 是否有更新wgtUrl
String wgt
包的下載地址,用於 wgt
方式更新。pkgUrl
String apk/ipa
包下載地址或 AppStore
地址,用於整包升級的方式。下面是一個簡單的伺服器端判定的範例,僅做參考,實際開發中根據自身業務需求處理。
var express = require('express'); var router = express.Router(); var db = require('./db'); // TODO 查詢組態檔或者資料庫資訊來確認是否有更新 function checkUpdate(params, callback) { db.query('一段SQL', function(error, result) { // 這裡簡單判定下,不相等就是有更新。 var currentVersions = params.appVersion.split('.'); var resultVersions = result.appVersion.split('.'); if (currentVersions[0] < resultVersions[0]) { // 說明有大版本更新 callback({ update: true, wgtUrl: '', pkgUrl: result.pkgUrl }) } else { // 其它情況均認為是小版本更新 callback({ update: true, wgtUrl: result.wgtUrl, pkgUrl: '' }) } }); } router.get('/update/', function(req, res) { var appName = req.query.name; var appVersion = req.query.version; checkUpdate({ appName: appName, appVersion: appVersion }, function(error, result) { if (error) { throw error; } res.json(result); }); });
注意事項
使用者端檢測升級
在 App.vue
的 onLaunch
中檢測升級,程式碼如下:
// #ifdef APP-PLUS plus.runtime.getProperty(plus.runtime.appid, function(widgetInfo) { uni.request({ url: 'http://www.example.com/update/', data: { version: widgetInfo.version, name: widgetInfo.name }, success: (result) => { var data = result.data; if (data.update && data.wgtUrl) { uni.downloadFile({ url: data.wgtUrl, success: (downloadResult) => { if (downloadResult.statusCode === 200) { plus.runtime.install(downloadResult.tempFilePath, { force: false }, function() { console.log('install success...'); plus.runtime.restart(); }, function(e) { console.error('install fail...'); }); } } }); } } }); }); // #endif
不支援資源升級包情況如下:
SDK
部分有調整,比如新增了 Maps
模組等,不可通過此方式升級,必須通過整包的方式升級。nvue
檔案,但更新中新增了 nvue
檔案,不能使用此方式。因為非自定義元件編譯模式如果沒有nvue
檔案是不會打包weex
引擎進去的,原生引擎無法動態新增。自定義元件模式預設就含著weex
引擎,不管工程下有沒有nvue
檔案。注意事項
App
平臺執行此升級邏輯。appid
以及版本資訊等,在 HBuilderX
真機執行開發期間,均為 HBuilder
這個應用的資訊,因此需要打包自定義基座或正式包測試升級功能。plus.runtime.version
或者 uni.getSystemInfo()
讀取到的是 apk/ipa
包的版本號,而非 manifest.json
資源中的版本資訊,所以這裡用 plus.runtime.getProperty()
來獲取相關資訊。wgt
資源包成功後,必須執行 plus.runtime.restart()
,否則新的內容並不會生效。App
的原生引擎不升級,只升級wgt
包時需要注意測試wgt
資源和原生基座的相容性⚠️。平臺預設會對不匹配的版本進行提醒,如果自測沒問題,可以在manifestt.json
中設定忽略提示。但實際上熱更新使用非常普遍,不管是原生開發中還是跨平臺開發。
Apple
曾經禁止過jspatch
,但沒有打擊其他的熱更新方案,包括cordovar、react native、DCloud
。封殺jspatch
其實是因為jspatch
有嚴重安全漏洞,可以被駭客利用,造成三方駭客可篡改其他App
的資料。
使用熱更新需要注意:
https
下載,避免被三方網路劫持;iOS
的虛擬支付要老老實實給Apple
分錢。介面約定
如下資料介面約定僅為範例,開發者可以自定義介面引數。
請求地址:https://www.example.com/update
請求方法:GET
請求資料:
{ "appid": plus.runtime.appid, "version": plus.runtime.version }
響應資料:
{ "status":1,//升級標誌,1:需要升級;0:無需升級 `在這裡插入程式碼片` "note": "修復bug1;\n修復bug2;",//release notes "url": "http://www.example.com/uniapp.apk" //更新包下載地址 }
App
啟動時,向伺服器端上報當前版本號,伺服器端判斷是否提示升級。
在App.vue
的onLaunch
中,發起升級檢測請求,如下:
onLaunch: function () { //#ifdef APP-PLUS var server = "https://www.example.com/update"; //檢查更新地址 var req = { //升級檢測資料 "appid": plus.runtime.appid, "version": plus.runtime.version }; uni.request({ url: server, data: req, success: (res) => { if (res.statusCode == 200 && res.data.status === 1) { uni.showModal({ //提醒使用者更新 title: "更新提示", content: res.data.note, success: (res) => { if (res.confirm) { plus.runtime.openURL(res.data.url); } } }) } } }) //#endif }
注意:App
的升級檢測程式碼必須使用條件編譯,否則在微信環境由於不存在plus
相關API
,將會報錯。
需維護一張資料表,用於維護APP
版本資訊,主要欄位資訊如下:
欄位名稱 | 資料型別 | 資料說明 |
---|---|---|
AppID | varchar | mobile AppID |
version | varchar | 應用市場版本號 |
notes | varchar | 版本更新說明 |
url | varchar | 應用市場下載URL。 注意:根據谷歌、App Store應用市場稽核規範,應用升級只能通過提交應用市場更新,不能通過下載apk 、IPA 安裝方式更新應用。 |
根據使用者端接收的版本號,比對伺服器端最新版本號,決定是否需要升級,若需升級則返回升級資訊(rlease notes
、更新包地址
等)
開發者可以根據伺服器端開發語言,自己實現升級檢測邏輯,如下是一個php
範例程式碼:
header("Content-type:text/json"); $appid = $_GET["appid"]; $version = $_GET["version"]; //使用者端版本號 $rsp = array("status" => 0); //預設返回值,不需要升級 if (isset($appid) && isset($version)) { if ($appid === "__UNI__123456") { //校驗appid if ($version !== "1.0.1") { //這裡是範例程式碼,真實業務上,最新版本號及relase notes可以儲存在資料庫或檔案中 $rsp["status"] = 1; $rsp["note"] = "修復bug1;\n修復bug2;"; //release notes $rsp["url"] = "http://www.example.com/uniapp.apk"; //應用升級包下載地址 } } } echo json_encode($rsp); exit;
注意事項:
plus.runtime.appid
,plus.runtime.version
, plus.runtime.openURL()
在真機環境下才有效。app
,真機執行基座無法測試。因為真機執行的plus.runtime.version
是固定值。apk
安裝方式更新應用。apk
安裝失敗可能是因為缺少android.permission.INSTALL_PACKAGES
、android.permission.REQUEST_INSTALL_PACKAGES
許可權導致,注意:新增上面兩個許可權無法通過谷歌稽核。uni-app
提供了一整套版本維護框架,包含升級中心uni-upgrade-center - Admin
、前臺檢測更新uni-upgrade-center-app
。
uni-app
提供了版本維護後臺應用升級中心uni-upgrade-center - Admin
,升級中心是一款uni-admin
外掛,負責App
版本更新業務。包含後臺管理介面、更新檢查邏輯,App
內只要呼叫彈出提示即可。
在上傳安裝包介面填寫此次發版資訊,其中包地址可以選擇手動上傳一個檔案到雲端儲存,會自動將地址填入該項。
也可以手動填寫一個地址(例如:https://appgallery.huawei.com/app/C10764638),就可以不用再上傳檔案。
如果是釋出蘋果版本,包地址則為應用在AppStore
的連結。
升級中心有以下功能點:
- 雲儲存安裝包
CDN
加速,使安裝包下載的更快、更穩定- 應用管理,對
App
的資訊記錄和應用版本管理。- 版本管理,可以釋出新版,也可方便直觀的對當前
App
歷史版本以及線上發行版本進行檢視、編輯和刪除操作。- 版本釋出資訊管理,包括更新標題,內容,版本號,靜默更新,強制更新,靈活上線發行的設定和修改。
- 原生
App
安裝包,釋出Apk
更新,用於App
的整包更新,可設定是否強制更新。wgt
資源包,釋出wgt
更新,用於App
的熱更新,可設定是否強制更新,靜默更新。- App管理列表及App版本記錄列表搜尋。
- 只需匯入外掛,初始化資料庫即可擁有上述功能。
- 也可以自己修改邏輯自定義資料庫欄位,和隨意客製化 UI 樣式。
uni-upgrade-center-app
負責前臺檢查升級更新。
專案結構如下圖所示:
檢測更新檢視如下圖所示:
該外掛提供如下功能:
- 統一管理
App
及App
在Android
、iOS
平臺上App
安裝包和wgt
資源包的釋出升級。- 基於
uni-upgrade-center
一鍵式檢查更新,統一整包與wgt
資源包更新。- 自行根據傳參完成校驗,判斷此次更新使用哪種方式。
- 一鍵式升級。已整合彈框、下載、安裝、是否強制重新啟動等邏輯。
- 下載完成如果取消升級自動快取安裝包,下次進入判斷是否符合安裝條件,判斷不通過則自動清除。
- 美觀,實用,可自定義擴充套件。
注意:在手機基座上執行時獲取到的版本號和appid是hbuilder和hbuilder的版本需要在檔案裡面手動設定。
升級中心uni-upgrade-center - Admin負責維護版本資訊,並將版本資訊維護至資料庫中。
前臺檢測更新外掛uni-upgrade-center-app負責提供呼叫雲函數讀取資料庫維護的版本資訊一鍵式檢查更新。
推薦:《》
以上就是uni-app跨平臺應用開發之實現資源線上升級的詳細內容,更多請關注TW511.COM其它相關文章!