Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Cordova Wrapper App Where Internal Links Load In App, External Links Load In Browser

I have a simple Cordova wrapper app which points to an external webpage, without defining any of its own views.

I would like all internal links from that domain to be loaded inside the app, but all external links (http://twitter.com, etc) to be loaded in the system browser, so the pages have Back / Forward functionality.

In a normal app with views, I could set target='_system' to load links in the default browser, or use the cordova-plugin-inappbrowser to explicitly open links in a web browser view. Unfortunately in this case I don't have the ability to edit the server side code, so need a solution that works within the app.

If I define the config.xml as such, then both internal and external links are loaded in app.

<content src="http://example.com/" />
<access origin="*" />
<allow-navigation href="*" />

If I define the config.xml with allow-intent, then internal and external links are opened in the system browser.

<content src="http://example.com/" />
<access origin="*" />
<allow-navigation href="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />

Others have suggested using custom javascript to override the target to _system, however since I don't have my own views I can't really do that.

Is it possible to define allow-intent for the cordova-plugin-whitelist in such a way to include all URLs that are not the internal domain?

Or will I need to somehow override shouldStartLoadWithRequest in MainViewController and then call [[UIApplication sharedApplication] openURL:url]?

like image 232
Dale Zak Avatar asked May 10 '16 00:05

Dale Zak


1 Answers

Ok, after some experimenting and suggestions from Hayyaan, I was able to come up with combination of allow-navigation and allow-intent which served my purpose.

<content src="https://example.com/" />
<access origin="*" />
<allow-navigation href="about:*" />
<allow-navigation href="https://example.com/*" />
<allow-navigation href="https://*.example.com/*" />
<allow-navigation href="https://*.facebook.com/*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />

Now all internal links from the website domain are loaded in the app, while external links are loaded in the system browser.

Note, I included <allow-navigation href="https://*.facebook.com/*" /> to allow loading of Facebook libraries otherwise I received an error.

ERROR Internal navigation rejected - 
<allow-navigation> not set for url='https://staticxx.facebook.com/connect/xd_arbiter.php?

And also included <allow-navigation href="about:*" /> to avoid an error for about:blank.

ERROR Internal navigation rejected - <allow-navigation> not set for url='about:blank'

Hopefully this helps someone else with the same problem :)

like image 95
Dale Zak Avatar answered Oct 16 '22 09:10

Dale Zak