inAppBrowser works from Ionic 2 CLI but not from Xcode


#1

I can get the inAppBrowser plugin to work perfectly when I run a test from the Ionic 2 CLI, but when I open the project in Xcode and try to run it from there, the inAppBrowser doesn’t seem to fire. Any help would be appreciated. Thanks in advance!

Here’s the code I’m using to launch the inAppBrowser:

this.browser = this.iab.create('https://mywebportal.com/', '_blank', "location=no,fullscreen=yes,hardwareback=yes,toolbar=no").on('loadstop').subscribe(() => {
  this.splashScreen.hide(); ///* never hides the splash screen when running from Xcode *///
});

Here are my configurations:

Ionic: 2.2.3
Cordova: 6.5.0
inAppBrowser: 1.7.1
Whitelist: 1.3.1
Xcode: 8.3.2
macOS: 10.12.4
iPod iOS: 10.3.1 (14E304)
iPod 16GB model: NKGX2LL/A

In my config.xml file, I added the line:

<access origin="https://mywebportal.com/"/>

In my index.html file, I added the line:

<meta http-equiv="Content-Security-Policy" content="img-src * 'self' data:; default-src * 'self' https://mywebportal.com/ gap: wss: ws: ; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval';">

And finally, here is the output from Xcdoe:

2017-05-13 12:31:44.518682-0400 myApp[393:26205] Apache Cordova native platform version 4.3.1 is starting.
2017-05-13 12:31:44.519821-0400 myApp[393:26205] Multi-tasking -> Device: YES, App: YES
2017-05-13 12:31:44.531100-0400 myApp[393:26205] 

Started backup to iCloud! Please be careful.
Your application might be rejected by Apple if you store too much data.
For more information please read "iOS Data Storage Guidelines" at:
https://developer.apple.com/icloud/documentation/data-storage/
To disable web storage backup to iCloud, set the BackupWebStorage preference to "local" in the Cordova config.xml file
2017-05-13 12:31:44.629636-0400 myApp[393:26205] Using UIWebView
2017-05-13 12:31:44.632111-0400 myApp[393:26205] [CDVTimer][handleopenurl] 0.119984ms
2017-05-13 12:31:44.636016-0400 myApp[393:26205] [CDVTimer][intentandnavigationfilter] 3.785968ms
2017-05-13 12:31:44.636271-0400 myApp[393:26205] [CDVTimer][gesturehandler] 0.155985ms
2017-05-13 12:31:44.659115-0400 myApp[393:26205] [CDVTimer][splashscreen] 22.693992ms
2017-05-13 12:31:44.669336-0400 myApp[393:26205] [CDVTimer][statusbar] 10.036945ms
2017-05-13 12:31:44.671052-0400 myApp[393:26205] [CDVTimer][keyboard] 1.518011ms
2017-05-13 12:31:44.671192-0400 myApp[393:26205] [CDVTimer][TotalPluginStartup] 39.227009ms
2017-05-13 12:31:44.733648-0400 myApp[393:26258] libMobileGestalt MobileGestaltSupport.m:153: pid 393 (myApp) does not have sandbox access for frZQaeyWLUvLjeuEK43hmg and IS NOT appropriately entitled
2017-05-13 12:31:44.733747-0400 myApp[393:26258] libMobileGestalt MobileGestalt.c:550: no access to InverseDeviceID (see <rdar://problem/11744455>)
2017-05-13 12:31:45.160107-0400 myApp[393:26205] Resetting plugins due to page load.
2017-05-13 12:31:45.560031-0400 myApp[393:26205] Finished load of: file:///var/containers/Bundle/Application/AF0231CB-5AC9-442B-92F5-949645BDD84A/myApp.app/www/index.html
2017-05-13 12:31:45.620818-0400 myApp[393:26205] Ionic Native: deviceready event fired after 165 ms

*EDIT: After doing some more digging, I discovered that–in my case–the problem is with the splash screen plugin and having it fade while trying to perform other operations, which causes this to happen:

2017-05-13 12:31:45.160107-0400 myApp[393:26205] Resetting plugins due to page load.

So I had to move the splashScreen.hide() method back to app.component.ts and wrap the iab.create() method in a setTimeout() instead.

Thanks regardless! Cheers.


#2

setTimeout() is never the right answer in an Angular app. Are you sure you waited until the platform is ready?


#3

I had already tried wrapping my inAppBrowser.create() method in a platform.ready() and an ionViewDidLoad() call. In either case, I could not get the splash screen to hide, and therefore got the 2017-05-13 12:31:45.160107-0400 myApp[393:26205] Resetting plugins due to page load message in the Xcode log.

Further notes:

  • I disabled autohide for the splash screen in my config.xml file. The desired effect is to have the splash screen fade() method called upon the inAppBrowser loadstop event.

  • The aforementioned logic worked as desired on my Android device, as well as via ionic run ios from the CLI. The anomaly only appears when deploying from Xcode.

  • Firing splash screen fade() from a platform.ready() call in app.component.ts works fine, but from Xcode refuses to launch the inAppBrowser. Hence, the awkward setTimeout() workaround.

Perhaps if you could duplicate my scenario and see for yourself…? i.e., Try calling inAppBrowser.create() upon app initialization and fade splash screen upon loadstop event from Xcdoe.


#4

Did you try other targets besides blank?
I saw it’s not your case but I figured out the hard way that the target parameter is not optional on iOS.


#5

@jsanta I tried target _self to no avail. After doing some more research, I found that iOS prefers the target _blank attribute. Target _system would not give the desired effect of running within the app, of course. Thank you for your suggestion, regardless.