IFrame links to sub-domain and external domain behaving differently

Ionic Framework ionic-v3
1

I have an IFrame containing a page with two links, one to an external domain and one to a page on the same root domain as the IFrame page but on a different subdomain. I need both to open in Safari rather than in the Ionic app, but I’m only seeing the external links opening in safari; the sub-domain links open in Ionic, replacing the entire mobile app.

I’ve tried using both the target attribute and window.open, but with the same results. Where the IFrame page is on a domain called www.mydomain.com:

<a href='https://www.google.com/' target='_myCustomTarget'>Google.com</a>
<a href='https://subdomain.mydomain.com/' target='_myCustomTarget'>subdomain.mydomain.com</a>

The first link opens in safari; the second link opens in Ionic, replacing the entire mobile app. window.open has the same results:

<a href='javascript:window.open("https://www.google.com/", "_myCustomTarget")'>Google.com</a>
<a href='javascript:window.open("https://subdomain.mydomain.com/", "_myCustomTarget")'>subdomain.mydomain.com</a>

Is there a way to have the sub-domain link open in Safari as well?

$ ionic info

global packages:

@ionic/cli-utils : 1.4.0
Cordova CLI      : 7.0.1 
Ionic CLI        : 3.4.0

local packages:

@ionic/app-scripts              : 1.3.7
@ionic/cli-plugin-cordova       : 1.4.0
@ionic/cli-plugin-ionic-angular : 1.3.1
Cordova Platforms               : android 6.2.3 ios 4.4.0
Ionic Framework                 : ionic-angular 3.4.0

System:

Node       : v6.10.0
OS         : OS X El Capitan
Xcode      : Xcode 8.2.1 Build version 8C1002 
ios-deploy : 1.9.1 
ios-sim    : 5.0.13 
npm        : 3.10.10
2

Do you control “google.com” from your example? A quick solution would be to have a little script there that takes a URL as a param and then redirects there instantly.

3

Nope, we don’t control the external links; they could be to any website. They work ok though.

Having a dedicated external domain such as www.mydomain-redirect.com to handle redirects for sub domains would work I suppose - but is only a temporary band-aid solution. I think you are suggesting something like:

This would work but is not optimal as we would need convert all sub domain links to point to that redirect domain then have a special page or domain for the redirects.

4

I’ve logged this as an issue on GitHub: https://github.com/ionic-team/ionic/issues/12318

1 Like
5

This issue was caused by an unexpected third party JS click event handler getting added to the link. That event handler then chose to navigate to the new page by calling window.top.

The reason we see a difference in one link opening in the default browser and the other overwriting our Ionic app is that one of the urls, subdomain.mydomain.com, was whitelisted and the other was not.

When calling window.top, whitelisted domains overwrite the entire ionic app; non-white listed domains are opened in the default browser.

1 Like
6

Wow, what a nasty thing. Good to know for next time. (Which hopefully never comes)