ngCordova InAppBrowser plugin freeze app on iOS but no on Android

Question

I am currently using, IONIC v1.0.0, AngularJs and ngCordova v0.1.23-alpha on IOS and Android.

I have come across an issue with my login view freezing up. It happens after opening InAppBrowser and hitting "back to app" (close button caption used for IOS to get back) is freezes my login view disabling the ability to touch on the whole screen and making me unable to login. It only happens if I call InAppBrowser when starting the app, if I use it during the app life cycle (after login in), it doesn't do it.

Here are some of my code pieces

In app.js:

angular.module('MyApp', ['ionic', 'MyApp', 'ngCordova', 'mainController', 'loginController', 'pascalprecht.translate', 'ngStorage', 'ngSanitize', 'ngAnimate', 'ngTouch', 'ngCookies', 'ngLocale', 'testController'])

In mainController I have Factory:


.factory('customMainFunction', function ($rootScope, $ionicLoading, $ionicScrollDelegate, $ionicPopup,
    $timeout, $localStorage, $location, $ionicHistory, $window, $cordovaInAppBrowser) {

    var Token = "";

    return {

 openBrowser: function (link) {

            var options = {
                location: 'yes',
                clearcache: 'yes',
                toolbar: 'yes',
                closebuttoncaption: 'Back to App'
            };

            document.addEventListener("deviceready", function () {
                $cordovaInAppBrowser.open(link, '_blank', options)
                    .then(function (event) {
                        // success
                    })
                    .catch(function (event) {
                        // error
                    });

            }, false);


            $rootScope.$on('$cordovaInAppBrowser:loadstart', function (e, event) {

                //console.log(event);
                var url = "";
                var positionNumber;
                var res;

                url = event.url;                
                positionNumber = url.search("ssoToken=");                               
                res = url.substr(Number(positionNumber)+9);

                /*positionNumber = url.search("module=");                    
                res = url.substr(Number(positionNumber)+6);*/

                if(url !== "" && positionNumber >= 0 && res.length > 0) {

                    $rootScope.$broadcast('ssoToken', { token: res });               
                    $cordovaInAppBrowser.close();
                }

            });

            $rootScope.$on('$cordovaInAppBrowser:loadstop', function (e, event) {
                console.log("loadstop");
                //console.log(event);

                // insert CSS via code / file
                //$cordovaInAppBrowser.insertCSS({
                //    code: ''
                //});

                // insert Javascript via code / file
                //$cordovaInAppBrowser.executeScript({
                 //   file: ''
                //});
            });

            $rootScope.$on('$cordovaInAppBrowser:loaderror', function (e, event) {

            });

            $rootScope.$on('$cordovaInAppBrowser:exit', function (e, event) {

            });

        }
    }
})

If anybody has encounter such issue please let me know what can be done to resolve it. Any question or clarifications let me know. Thanks in advance.

score 0 · Accepted Answer · edited May 23 '17 at 12:16

0

Found the issue of my own problem. Basically the problem is related to Threading. Look for Threading. How did I find out about it? On XCode I was able to see a message saying:

THREAD WARNING: ['InAppBrowser'] took '108.12' ms. Plugin should use a background thread

There are two ways to solve this (I believe):

1- Using background threading (just like the message states). Please refer to: How to run cordova plugins in the background?

2- Wrap the openBrowser function call (in my case) in a setTimeout. That will delay the call until the thread is done and UI won't be blocked. Once done (in my case) it opened the inAppBrowser and when I hit "Back to app" UI was not block at all.

Hope this helps someone out there.

edited May 23 '17 at 12:16

Community

1
1

answered May 20 '16 at 17:07

the_best

57
7

I am having the same issue. I did try the point 2 you have mentioned above. For point 1, I modified the openInSystem method in CDVInAppBrowser.m to have the line dispatch_async(dispatch_get_main_queue(), ^{ [[UIApplication sharedApplication] openURL:url]; But I am still getting the issue. Any ideas? }); – Hetal Vora Feb 21 '17 at 21:55
Hello, @the_best I'm a little bit confused, I have to wrap the browser.on('loadstart') or inAppBrowser.create() which actually calls the plugin. – Saurabh Chauhan Feb 23 '18 at 04:10
browser = this.iab.create(this.url, '_blank', options); let listener = browser.on('loadstart') browser.on('loadstop') browser.on('loaderror') browser.on('exit') I'm using the following event on which I have to set the timeout? – Saurabh Chauhan Feb 23 '18 at 04:24

ngCordova InAppBrowser plugin freeze app on iOS but no on Android

1 Answers1