CODEWITHSUNDEEP
cordovaionic-frameworkionic2
Red Virus
Red Virus

Reputation: 1707

How to listen to inAppBrowser closed event

The following is the code that I am currently working with. I would like to understand how do I listen to the inAppBrowser close event? When some closes the inAppBrowser, the app should show some kind of alert message.

According to the documentation I have to use browser.close(), but this doesn't work.

import { Component } from '@angular/core';
import { NavController, NavParams, Platform, LoadingController } from 'ionic-angular';
import { InAppBrowser } from 'ionic-native';

@Component({
  selector: 'page-payment-information',
  templateUrl: 'payment-information.html'
})
export class PaymentInformationPage {

  constructor( public navCtrl: NavController, public navParams: NavParams, public platform: Platform, public loadingCtrl: LoadingController ) {
    this.platform = platform;
  }

  paymentForm(){
      let browser = new InAppBrowser('https://www.stackoverflow.com', '_blank', 'hidden=no,location=no,clearsessioncache=yes,clearcache=yes&enableViewportScale=yes');
      browser.close();
  }

}

Upvotes: 8

Views: 19210

Answers (4)

Eng.Haytham Badran
Eng.Haytham Badran

Reputation: 21

I know it to late this issue was 3 years ago but the issue is an issue so here is the solution

1st import InAppBrowser

import {InAppBrowser} from '@ionic-native/in-app-browser/ngx';

2nd add to constructor()

constructor(private iab: InAppBrowser ) {}

3rd Now you can use on('xxx') where xxx is the event you want Events list: 'loadstart' | 'loadstop' | 'loaderror' | 'exit' | 'beforeload' | 'message' | 'customscheme'

In your case, you want to listen when inAppBrowser is closed check follwoing example:

anyFunName(url){
let openBrowser = this.iab.create(url, '_blank');
openBrowser.on('exit').subscribe(event => {
  console.log("inAppBrowser is closed now");
  // your action here when close inAppBrowser
});
}

Upvotes: 2

mike nelson
mike nelson

Reputation: 22166

Just to clarify to Navneil Naicker's correct answer. If you don't have jquery, you would use addEventListener instead of on. And this can be done on the return value from window.open.

var popupWindow = window.open(url, "_blank");
popupWindow.addEventListener('exit', function (event) {
    alert('user closed in app browser!');
});

Upvotes: 1

Navneil Naicker
Navneil Naicker

Reputation: 3691

There are few things that is wrong in your code.

From the documentation browser.hide() doesn't do what you want to do.

Hides an InAppBrowser window that is currently shown. Calling this has no effect if the InAppBrowser was already hidden.

_blank replace it with _system because _blank opens in the inAppBrowser. You won't be able to listen for close event.

Now, you can subscribe to the browser and listen for it's events e.g.

//Events: loadstart, loadstop, loaderror, exit
browser.on('exit').subscribe(() => {
    console.log('browser closed');
}, err => {
    console.error(err);
});

Upvotes: 12

Gabriel Barreto
Gabriel Barreto

Reputation: 6421

I searched in the InAppBrowser docs and there's nothing like a listener/promisse for a closed event, what you can do instead is using Platform's resume event, so when the InAppBrowser closes and the app is coming from background to active state it fires this method.

In Ionic 2 API DOCS there's nothing saying how you can use it, but since you can subscribe to it then you can do something like this in your constructor (what probably wouldn't be good since the user can leave the app when in this page and come back) or inside your paymentFormmethod.

this.platform.resume.subscribe(() => {
  this.whatINeedToDoWhenUserIsBack();
});

Upvotes: 1

Related Questions