2017-04-02 65 views
3

如果有网络连接但互联网不工作。例如有一个WiFi连接,但WiFi没有互联网连接,浏览器观察者应该触发“loaderror”事件。ionic2 InAppBrowser(离子本机)loaderror不起作用

代码:

import { Component } from '@angular/core'; 
import { Platform,AlertController,LoadingController } from 'ionic-angular'; 
import { StatusBar } from '@ionic-native/status-bar'; 
import { SplashScreen } from '@ionic-native/splash-screen'; 
import { Network } from '@ionic-native/network'; 
import { HomePage } from '../pages/home/home'; 
import { InAppBrowser } from '@ionic-native/in-app-browser'; 


@Component({ 
    templateUrl: 'app.html' 
}) 
export class MyApp { 
    public rootPage:any = HomePage; 

    constructor(private platform: Platform,private statusBar: StatusBar,private splashScreen: SplashScreen, private network: Network, private alertCtrl: AlertController, private iab: InAppBrowser, private loadingCtrl: LoadingController) { 

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. 

    let alert = this.alertCtrl.create({ 
      title: "Network Problem", 
      subTitle: 'Internet is not connected' , 
      buttons: [ 
       { 
        text: 'Close', handler:() => { 
         this.platform.exitApp(); 
        } 
       } 
      ] 
     }); 
     const loading = this.loadingCtrl.create(); 
     if(this.network.type !== 'none') { 
      loading.present(); 
      const browser = this.iab.create('http://www.google.com','_blank','location=no,clearsessioncache=yes'); 
      browser.on("loaderror").subscribe(() => { 
       loading.dismiss(); 
       this.iab.create('http://192.168.2.222/users/dashboard','_blank','location=no,clearsesioncache=yes'); 
      }); 
      const sub = browser.on('loadstart').subscribe(() => { 
       loading.dismiss(); 
       sub.unsubscribe(); 
      }, 
       err => { loading.dismiss(); console.log('error') ; alert.present()}, 
       () => { loading.dismiss(); console.log('success') }); 
     }     

     /// check connectivity automatically . 

     let connectSubscription = network.onConnect().subscribe(() => { 
       loading.present(); 
       const browser = this.iab.create('http://www.google.com','_blank','location=no,clearsesioncache=yes'); 
       browser.on("loaderror").subscribe(() => { 
        loading.dismiss(); 
        this.iab.create('http://192.168.2.222/users/dashboard','_blank','location=no,clearsesioncache=yes'); 
       }); 
     }); 
     let disconnectSubscription = network.onDisconnect().subscribe(() => { 
       const browser = this.iab.create("error.html",'_blank','location=no');  
     }); 

    statusBar.styleDefault(); 
    splashScreen.hide(); 
    }); 
} 
} 

但它总是加载谷歌网页,甚至都能得到加载clearsessioncache和网络断开后。我在android和桌面上测试了这个。

+0

当url有问题时发生了什么? – Sampath

+0

什么都不显示白页,只在那里。 –

+0

我改变了加载错误的代码我的火脚本,它得到加载,但10秒后。当我启动我的应用程序需要10秒,当loaderror发生时,它再次需要10秒,所以共20。 –

回答

2

您可以尝试如下所示。

注意:因此它有一定的延迟,你必须使用loader如下所示。

goToWebPage() { 
    const loading = this.loadingCtrl.create();//use loader 
    loading.present(); 
    const browser = this.iab.create('http://www.google.com'); 
    const sub = browser.on('loadstart').subscribe(() => { 
     loading.dismiss(); 
     sub.unsubscribe(); 
    }, 
     err => { loading.dismiss();console.log('error'); }, 
    () => { loading.dismiss();console.log('success') }); 
    } 
+0

'if(this.network.type!=='none'){ \t \t \t \t const loading = this.loadingCtrl.create(); \t \t \t \t loading.present(); \t \t \t \t const browser = this.iab.create('http://www.google.com','_blank','location=no,clearsessioncache = yes'); \t \t \t \t \t \t const的子= browser.on( 'loadstart')订阅(()=> { \t \t \t \t \t loading.dismiss(); \t \t \t \t \t sub.unsubscribe() ; \t \t \t \t}, \t \t \t \t \t ERR => {的console.log( '错误'); }, \t \t \t \t \t()=> {console.log('success')}); \t \t \t}'**即使在加载页面之后,它并没有在控制台上显示SUCCESS消息,并且出现错误。** –

+0

完全使用我给你的代码片段。它完全适合我。 – Sampath

+0

它正在工作,但它需要太多的时间,因为我上面提到。 –