Link to open another app (iOS)

1

I have an iOS aviation app that I’m hoping to take advantage of an integration method that another aviation app (ForeFlight) offers. Their documentation states:

ForeFlight Mobile supports URL-based methods of loading views and data in the app. To use these, you create a URL with the proper format and then click on that URL within an app that supports link-tapping, such as the iOS Mail app

Full documentation here.

As per the above, a link works fine from within the iOS Mail app: the 2nd app (ForeFlight) is opened by clicking on the link. However, the link will not work when tapped in my phonegap app. Does anyone know if this is possible from a phonegap app? Is there a plugin that will allow a url link to open a 2nd app?

Thanks,

Nate

2

Nate, most likely it’s in your CSP… here’s a thread with a similar problem using a link to open/send email: https://forums.adobe.com/thread/2382509

3

Your CSP is defined in Project Properties, in the PhoneGap section, under contentSecurityPolicy.

Here are a couple of samples covering different scenarios:

default-src 'self' gap://ready file:;
style-src 'self' 'unsafe-inline';
script-src 'self' 'unsafe-inline' 'unsafe-eval';
media-src 'self'; 
img-src 'self';
connect-src https://*.xxx.ie tel:;

default-src 'self' gap://ready file: https://fonts.googleapis.com https://fonts.gstatic.com; 
style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; 
script-src 'self' 'unsafe-inline' 'unsafe-eval' https://developers.google.com https://maps.googleapis.com https: ;
media-src 'self' data: file: ; 
img-src 'self' data: android-webview-video-poster: ; 
connect-src https://api.xxx.com https://apidev.yyy.com/ blob: file: data: https: ;
4

Thanks George. I’m still using 5.2.1.3… where do you put CSP in that version? config.xml?

Nate

5

Hi George,

Poked around a bit and found that in the older versions in needs to go in the extraheaders property.

I’ll give that a try.

Nate

6

AppStudio 5.2.1.3?

I’m not sure that will still work properly with PhoneGap in other areas - they’ve made many changes in the meantime. Support for ContentSecurityPolicy was added in AppStudio 6:
https://blog.appstudio.dev/2015/12/phonegap-no-content-security-policy-message/

You might try adding this line to the extraHeaders project property:

<meta http-equiv="Content-Security-Policy" content="{0}" />

Where {0} is replaced by your CSP.

7

Thanks George.

I put the following in extraheaders (wide open CSP)

meta http-equiv=“Content-Security-Policy” content=“{default-src ‘self’ gap://ready file://* *; style-src ‘self’ ‘unsafe-inline’; script-src ‘self’ ‘unsafe-inline’ ‘unsafe-eval’}” />

and I still get a load error if I attempt to fire the following link from the inappbrowser:

foreflightmobile://maps/search?q=KJGG+ORD+KOSH+165+16+8000

If I use that same link from the iOS email app it works fine: i.e. opens the foreflightmobile app

Nate

8

Please include the load error message you are seeing. Chrome’s error messages are usually pretty good at explaining what is wrong and what to do next.

9

Also, the {} should not be there after you replace {0} with your CSP.

10

Thanks George. I tried with and without the {} with the same results. I’ve been traveling and will take a better look at the error messages on Monday. Thanks again!

Nate

11

There was an error with the CSP syntax I had; when I cut and paste, the single quotes around ‘self’, ‘unsafe-inline’ etc got translated into apostrophes. That’s fixed, but I still can’t get the link to the external app to work.

If I use the following link in a htmlView, it obviously opens the webpage fine:

<a href='http://www.nsbasic.com'>NSBasic</a>

However if I use the following link, nothing happens (no errors are thrown in Safari if I’m using on-device debugging either)

<a href='foreflightmobile://maps/search?q=KJGG+ORD+KOSH+165+16+8000'>ForeFlight</a>

Another piece of info: If I use the cordova plugin from my app to open an email (which opens in the iOS email app) with the above ForeFlight link as part of the body of the email, and then tap the link from the email it opens the ForeFlight app as advertised–works great.

Is iOS limited which apps can make external calls to open other apps?

Thanks for any help or pointers you can give.

Nate

12

Are there any error messages in the Chrome Remote Console?

13

I’m using an iPad so remote debugging in Safari, and no, nothing (other than the min.map error) in the console before or after clicking the link:

image

14

I’m not aware of any restrictions running intents from an iOS web app - but that doesn’t mean there are none.

Try the sample EmailSkypePhoneSMS. It uses several other intents in a similar fashion.

15

For a long time this was called “deep linking” but in iOS 9.2 (and forward) this was called Universal Linking and had a whole different set of requirements on the other (flight) side. I would suggest you investigate that further and make sure they have switched to the new method. FWIW, Android also changed how they handle “deep links.” All of these changes came about because us Cordova app developers have been lax in validating URL data and have open our apps and the devices to hacks. You can google “Cordova deep linking” and get tons of blogs, how to’s and plugins for this.

16

George & Phil,

Thanks for the help. After a bit of research and a bunch of experimenting I finally was able to accomplish what I was after. The issue seems to be that I need to explicitly call the system browser when providing the url to the ForeFlight app. (In the end it didn’t need any CSP changes).

This will not work when using ‘_blank’:

cordova.InAppBrowser.open(“foreflightmobile://maps/search?q=KJGG+ORD+KOSH+165+16+8000”,“_blank”)

This works using ‘_system’ and directly opens the other app from within my app:

cordova.InAppBrowser.open(“foreflightmobile://maps/search?q=KJGG+ORD+KOSH+165+16+8000”,“_system”)

Thanks for your patience in the process!

Nate

17

Awesome! Good for you!

18

Thanks for posting the answer!