Ionic4.x, Cordova Android version number detection applications, servers, download files, and realize App automatic upgrade, installation

Android App upgrade process execution

 

1 , obtaining the local version
2 , the version number of the requesting server obtaining a server

3 , local and server versions are inconsistent prompted to upgrade, whether the user is prompted to update pop

4 , the user determines upgrade, call the file transfer method Download apk file

5 , monitor the download progress
6 , the download is complete open Apk installation

Note : In the i os can not download and install directly, if the version is inconsistent jump directly to Ios application corresponding to the application on the market.

 

---

 

Automatic upgrade APP plug-in needed

 

Plugin name		Plug Address
App Version	cordova-plugin-app-version	https://ionicframework.com/docs/native/app-version/
File Opener	cordova-plugin-file-opener2	https://ionicframework.com/docs/native/file-opener/
File Transfer	cordova-plugin-file-transfer	https://ionicframework.com/docs/native/file-transfer/
File	cordova-plugin-file	https://ionicframework.com/docs/native/file/

 

In app.module.ts introduction of injection

 

import { FileOpener } from '@ionic-native/file-opener/ngx';
import { FileTransfer } from '@ionic-native/file-transfer/ngx'; 
import { AppVersion } from '@ionic-native/app-version/ngx'; 
import { File } from '@ionic-native/file/ngx';

 

providers: [
    FileOpener,
    FileTransfer,
    AppVersion,
    File,
    ...
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy } ]

Need to monitor update download page introduced, injection

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 { AlertController } from '@ionic/angular';

constructor(private file: File,private transfer:FileTransfer,private appVersion: AppVersion,private fileOpener: FileOpener,public alertController: AlertController) {
}

4 , get the version number

this.appVersion.getVersionNumber().then((value:any) => { console.log(value)
}).catch(err => { console.log('getVersionNumber:' + err);
});

5 , to get the current apk installation directory

 

this.file.dataDirectory

 

const targetUrl = 'http://127.0.0.1:8080/test.apk';
const fileTransfer: FileTransferObject = this.transfer.create(); fileTransfer.download(targetUrl, this.file.dataDirectory + 'test.apk').then((entry) => {
}, (error) => { alert(JSON.stringify(error));
});

6 , download files, monitor the download progress

onst fileTransfer: FileTransferObject = this.transfer.create();
fileTransfer.download(url, this.file.dataDirectory + test.apk'). then((entry) => {
alert('download complete: ' + entry.toURL()); }, (error) => { 
alert(JSON.stringify(error));});

schedule:

var oProgressNum=document.getElementById('num'); fileTransfer.onProgress((event: ProgressEvent) => {
let num =Math.ceil(event.loaded/event.total * 100); if (num === 100) {
oProgressNum.innerHTML='下载完成'; } else {
oProgressNum.innerHTML='下载进度:' + num + '%'; }
});

7 , open the installation file

 

 this.fileOpener.open(entry.toURL(), 'application/vnd.android.package-archive')
      .then(() => {
console.log('File is opened')
})
.catch(e => {
console.log('Error openening file', e) });

 

demo：

import { Component } from '@angular/core';

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 { AlertController } from '@ionic/angular';



@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss']
})
export class Tab1Page { 


  constructor ( Private File: File, Private Transfer: FileTransfer, Private appVersion: AppVersion, Private fileOpener: FileOpener, public alertController: AlertController) { 
  } 

  // device loaded again call the hardware 

  ngAfterContentInit (): void {
     // Called . When After ngOnInit the Component Content apos apos Directive or has been a initialized
     // the Add 'the implements AfterContentInit' the class to. 
    this .isUpdate (); 
  } 

  isUpdate () { 
    // . 1, acquires the current version of the application 

    this. .appVersion.getVersionNumber () the then ((value: the any) => { 
      the console.log (value) 

      // 2, the server requests the server interface to obtain the version number of 

      the this .showAlert (); 

    }). the catch (ERR => { 
      the console.log ( 'getVersionNumber:' + ERR); 
    ;}) 

  } 

  the async showAlert () { 

    // if the user is prompted to update pop 3.     
    const Alert = the await the this .alertController.create ({ 
      : header '! upgrade' , 
      Message : 'discovering new version, whether to upgrade now?' , 
      Buttons: [ 
        { 
          text: 'cancel' , 
          Role:'cancel',
          cssClass: 'secondary',
          handler: (blah) => {
          }
        }, {
          text: '确认',
          handler: () => {
            //4.下载apk
            this.downloadApp();
          }
        }
      ]
    });
    await alert.present();

  }

  downloadApp() {
    //4.下载apk
    const targetUrl = 'http://127.0.0.1:8080/test.apk';
    const fileTransfer: FileTransferObject = this.transfer.create (); 

    console.log ( the this .file.dataDirectory);    // get the current application installation (home) directory 1, 2 application package name to be consistent, the upgrade package version number is greater than the current version of the application 3, the signature to be consistent. 4, to be installed SDK 

    fileTransfer.download (to targetUrl, the this .file.dataDirectory + 'aaa.apk'). the then ((entry) => {
       // . 6, open the application calls the download is complete 

       the this .fileOpener .Open (entry.toURL (),
         'file application / vnd.android.package-Archive' ) 
        .then (() => { 
          the console.log ( 'the Opened File IS' ) 
        }) 
        . the catch (E => { 
          Console. log ('Error openening File' , E) 
        }); 


    }, (error) => { 
      Alert (the JSON.stringify (error)); 
    }); 


    // . 5, obtaining the download progress     
    var oProgressNum = document.getElementById ( 'progressnum' ) ; 
    fileTransfer.onProgress ((Event) => { 
      the let NUM = Math.ceil (event.loaded / event.total * 100);   // converted to progress 1-100 
      IF (NUM === 100 ) { 
        oProgressNum.innerHTML = 'download completed " ; 
      } the else { 
        oProgressNum.innerHTML =' download progress: '+ NUM +'% ' ; 
 
      }
    });

  }
}

 

effect: