vue 项目通过 HBuilder 打包成 apk,实现 apk 自动更新下载
1、vue 项目通过 HBuilder 打包成 apk
-
vue 项目在终端执行
npm run build
打包成 dist 文件,生成的 dist 文件在 项目根目录下
-
在 HBuilder 中 新建一个项目
-
默认选择
5+APP
的默认模板项目
-
将 vue 项目中的 dist 文件复制到 HBuilder 项目中
实现 apk 自动更新下载
在 index.html
中添加
<script type='text/javascript'>
document.addEventListener('plusready', function() {
// 版本更新下载
// 获取当前版本
const localVersion = plus.runtime.versionCode
console.log('localVersion' + localVersion)
// 获取线上版本 发送 POST 请求
var xhr = new XMLHttpRequest()
xhr.open('POST', '线上http地址', true)
xhr.onreadystatechange = function() {
const jsonData = JSON.parse(xhr.responseText)
var serverVersion = jsonData.versionCode
console.log('serverVersion' + serverVersion)
}
xhr.send()
// 比较版本号
if (this.serverVersion == this.localVersion) {
alert('当前已经是最新版本了!')
} else {
var confirmText = confirm('发现最新版本,是否立即更新?')
if (confirmText) {
console.log('下载最新版本')
// 下载最新版本
let url = 'https地址'
var dtask = plus.downloader.createDownload(url, {
method: "GET"
},
function(d, status) {
// 下载完成
if (status = 200) {
console.log('Download success: ' + d.filename)
// 下载完成的文件路径
var filePath = d.filename
// 安装 apk
plus.runtime.install(filePath, {
force: true
}, function() {
console.log('更新成功');
alert('安装成功,重启中...')
}, function(e) {
console.error('更新失败: ' + e.message);
alert('安装失败')
})
} else {
alert('下载失败,请重新下载!')
console.log('Download failed: ' + status)
}
})
// 开始下载
dtask.start()
} else {
alert('您选择了取消!')
}
}
})
</script>```