這篇文章為大家帶來了關於uniapp的相關知識，主要介紹了怎麼實現資源在線升級以及熱更新的相關問題，使用uni-app開發跨終端應用，可將代碼編譯到iOS、Android、微信小程式等平台，升級時也要考慮多平台同步升級，希望對大家有幫助。
推薦：《uniapp影片教學》
一、前言
使用uni-app 開發跨終端應用，可將程式碼編譯至iOS、Android、微信小程式等多個平台，升級時也需考慮多平台同步升級。其中，uni-app發佈為小程式的升級模式較簡單，只需將開發完的程式碼提交小程式後台，待審核通過後用戶將自動升級。
HBuilderX 1.6.5 起，uni-app 支援產生 App 資源升級套件wgt。
二、wgt 資源升級套件升級
2.1 修改版本號碼
首先，更新 manifest.json 中的版本號碼。
例如之前是 1.0.0，那麼新版本應該是 1.0.1 或 1.1.0 這樣。
2.2 發行
然後，在 HBuilderX 中產生升級套件（wgt）。
菜单->发行->原生App-制作移动App资源升级包
登入後複製
產生結束會在控制台告知升級套件的輸出位置。
2.3 安裝資源升級套件
應用程式的升級需要服務端與用戶端配合完成，以下以本機測試過程中的操作範例說明：
存放資源
將%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 位址，用於整包升級的方式。
2.3.1 程式碼範例
以下是一個簡單的服務端判定的範例，僅做參考，實際開發中根據自身業務需求處理。
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] <p>注意事項</p>登入後複製
- 服務端的具體判定邏輯，請依照自身的業務邏輯靈活處理。
- 應用程式中的路徑盡量不要包含特殊符號。
客戶端偵測升級
在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" //更新包下载地址
}登入後複製
3.1 客户端实现
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，将会报错。
3.2 数据表实现
需维护一张数据表，用于维护APP版本信息，主要字段信息如下：
| 字段名称 |
数据类型 |
数据说明 |
AppID |
varchar |
mobile AppID |
version |
varchar |
应用市场版本号 |
notes |
varchar |
版本更新说明 |
url |
varchar |
应用市场下载URL。 注意：根据谷歌、App Store应用市场审核规范，应用升级只能通过提交应用市场更新，不能通过下载apk、IPA安装方式更新应用。 |
3.3 服务端实现
根据客户端接收的版本号，比对服务端最新版本号，决定是否需要升级，若需升级则返回升级信息（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-app提供了一整套版本维护框架，包含升级中心uni-upgrade-center - Admin、前台检测更新uni-upgrade-center-app。
4.1 升级中心 uni-upgrade-center - Admin
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 样式。
4.2 前台检测更新 uni-upgrade-center-app
uni-upgrade-center-app 负责前台检查升级更新。
项目结构如下图所示：
检测更新视图如下图所示：
该插件提供如下功能：
- 統一管理
App及App在Android、iOS平台上App安裝包和wgt資源包的發布升級。
- 基於
uni-upgrade-center一鍵式檢查更新，統一整包與 wgt 資源包更新。
- 自行根據傳參完成校驗，判斷此次更新使用哪一種方式。
- 一鍵式升級。已整合彈框、下載、安裝、是否強制重新啟動等邏輯。
- 下載完成如果取消升級自動快取安裝包，下次進入判斷是否符合安裝條件，判斷不通過則自動清除。
- 美觀，實用，可自訂擴充。
注意：在手機基座上運行時取得到的版本號和appid是hbuilder和hbuilder的版本需要在文件裡面手動設定。
4.3 工作原理
升級中心uni-upgrade-center - Admin負責維護版本信息，並將版本信息維護至數據庫中。
前台偵測更新外掛程式uni-upgrade-center-app負責提供呼叫雲端函數讀取資料庫維護的版本資訊一鍵式檢查更新。
推薦：《uniapp教學》
以上是uni-app跨平台應用開發實現資源線上升級的詳細內容。更多資訊請關注PHP中文網其他相關文章！
