IONIC APP局域网内更新

最新推荐文章于 2024-07-27 09:58:39 发布

爱你雨中泪

最新推荐文章于 2024-07-27 09:58:39 发布

阅读量354

点赞数

分类专栏： IONIC 文章标签： react native

本文链接：https://blog.csdn.net/u014316488/article/details/108129120

版权

IONIC 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

IONIC APP 自动更新
一、使用App Update(简单)。
安装cordova-plugin-app-update插件
在这里插入图片描述
2、在服务器上建立一个更新文件。
IIS上新建站点：

站点需要新增MIME类型

2、代码实现：
在启动页面添加一下代码

在appmodules中导入AppUpdate插件

二、代码实现；
参考https://blog.csdn.net/u012149927/article/details/104362012
进行安装插件：
然后在app.module.ts中导入。
生成一个下载的服务。在服务中写相关代码

import {Injectable} from '@angular/core';
import { NavController } from '@ionic/angular';
import { ToastController } from '@ionic/angular';
import { AlertController } from '@ionic/angular';
import { FileOpener } from '@ionic-native/file-opener/ngx';
import { FileTransfer, FileTransferObject } from '@ionic-native/file-transfer/ngx';
import { AppVersion } from '@ionic-native/app-version/ngx';
import { File } from '@ionic-native/file/ngx';
import { HttpClient } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})
export class AutoUpdateServiceService {

  constructor(public navController: NavController,
              public alertCtrl: AlertController ,
              public toastController: ToastController ,
              public file: File,
              public transfer: FileTransfer,
              public appVersion: AppVersion,
              private http: HttpClient,
              public fileOpener: FileOpener
  ) { }




  async presentToast(msg: any) {
                const toast = await this.toastController.create({
                  message: msg,
                  duration: 2000,
                  position: 'middle',
                  color: 'dark',
                  cssClass: 'total_toast'
                });
                toast.present();
              }

  checkUpdate() {
     // 1、获取当前应用的版本号
     this.appVersion.getVersionNumber().then((value: any) => {
       console.log(value);
      // 版本校验
       this.showAlert();
    }).catch(err => {
      console.log('getVersionNumber:' + err);
    });

  }

  async showAlert() {
    // 3.弹窗提示用户是否更新
    const alert = await this.alertCtrl.create({
      header: '系统提示',
      message: '发现新版本,请立即升级？',
      backdropDismiss: false,
      buttons: [
        {
          text: '取消',
          role: 'cancel',
          cssClass: 'secondary',
          handler: (blah) => {
            console.log('不能取消');
            navigator['app'].exitApp();
          }
        }, {
          text: '确认',
          handler: () => {
            // 4.下载apk
            this.downloadApp();
            document.getElementById('progressnum').style.display = 'inline';
          }
        }
      ]
    });
    await alert.present();
  }

  downloadApp() {
    // 4.下载apk
    const targetUrl = 'http://192.168.0.9:8989/hot/app-debug.apk';
    const fileTransfer: FileTransferObject = this.transfer.create();
    console.log(this.file.dataDirectory);
    // 获取当前应用的安装（home）目录     1、应用包名称要一致   2、升级的包的版本号要大于当前应用的版本号   3、签名要一致    4、sdk 要安装
    fileTransfer.download(targetUrl, 'cdvfile://localhost/persistent/app-debugs.apk').then((entry) => {
      // 6、下载完成调用打开应用
      this.fileOpener.open('cdvfile://localhost/persistent/app-debugs.apk',
        'application/vnd.android.package-archive')
        .then(() => {
          console.log('File is opened');
        })
        .catch(e => {
          console.log('Error openening file', e);
        });
    }, (error) => {
      alert(JSON.stringify(error));
    });

    // 5、获取下载进度
    let oProgressNum = document.getElementById('progressnum');
    fileTransfer.onProgress((event) => {
      const num = Math.ceil(event.loaded / event.total * 100);  // 转化成1-100的进度
      if (num === 100) {
        oProgressNum.innerHTML = '下载完成';
      } else {
        oProgressNum.innerHTML = '下载进度：' + num + '%';
      }
    });
  }
}