在Android应用安装中添加互联网连接要求(离子项目)

时间:2018-07-25 14:11:00

标签: cordova android-studio ionic3

我已经为Android平台构建了一个离子项目应用程序,该应用程序加载了用于显示内容的API。我需要知道如何添加连接访问要求,以在用户要在其设备中安装应用程序时显示。

1 个答案:

答案 0 :(得分:1)

创建一个网络提供商,并类似于以下代码:

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { AlertController, Events } from 'ionic-angular';
import { Network } from '@ionic-native/network';

/*
  Generated class for the NetworkProvider provider.

  See https://angular.io/guide/dependency-injection for more info on providers
  and Angular DI.
*/
export enum ConnectionStatusEnum {
    Online,
    Offline
}
@Injectable()
export class NetworkProvider {

  constructor(public http: HttpClient,
              public alertCtrl: AlertController, 
              public network: Network,
              public eventCtrl: Events) {
    console.log('Hello NetworkProvider Provider');
    this.previousStatus = ConnectionStatusEnum.Online;
  }

  public initializeNetworkEvents(): void {
        this.network.onDisconnect().subscribe(() => {
            if (this.previousStatus === ConnectionStatusEnum.Online) {
                this.eventCtrl.publish('network:offline');
            }
            this.previousStatus = ConnectionStatusEnum.Offline;
        });
        this.network.onConnect().subscribe(() => {
            if (this.previousStatus === ConnectionStatusEnum.Offline) {
                this.eventCtrl.publish('network:online');
            }
            this.previousStatus = ConnectionStatusEnum.Online;
        });
    }

}

别忘了将其导入到您的app.module.ts

...
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    PhotoProvider,
    NetworkProvider
  ]
...

在其他任何地方使用它,例如在app.component.ts中:

import { Component } from '@angular/core';
import { Platform, Events } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { Network } from '@ionic-native/network';
import { NetworkProvider } from '../providers/network/network';

import { HomePage } from '../pages/home/home';
@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  rootPage:any = HomePage;

  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      statusBar.styleDefault();
      splashScreen.hide();
    });
  }

  initializeApp() {

            this.platform.ready().then(() => {

                this.networkProvider.initializeNetworkEvents();

                // Offline event
                this.events.subscribe('network:offline', () => {
                    alert('network:offline ==> '+this.network.type);    
                });

                // Online event
                this.events.subscribe('network:online', () => {
                    alert('network:online ==> '+this.network.type);        
                });

            });
        }
}