External page back to local app in PhoneGap

Question

I have read through numerous posts and articles regarding this, but still can't find a good solution. I am trying to:

1. Start app on a local page
2. Go to an external page triggered using window.location.href after an AJAX event.
3. Return to the local app from external page when a close button is clicked using window.location.href = "appURL://".

I have the URL_SCHEME plugin setup with my custom url (appURL://). That URL works from the browser directly, but not within the app. It seems to just ignore it and move on to other code.

Now I have read about InAppBrowser and ChildBrowser. I tried InAppBrowser, but it doesn't keep the settings I need like the appendUserAgent and AllowInlineMediaPlayback. I know I can set the latter, but didn't see a way for the former. I also want to make sure it stays in landscape only and don't want to have two different places for configuration settings. Even without that, I still couldn't get it to link back to the app.

Is there not a way to link back to the local app from an external site without a browser plugin or if not, how do I make it work well using a browser plugin? I have full control over the external site.

The main device I am testing with is an iPhone 6 on iOS 9.2.1 and I am using PhoneGap Build.

Answer 1

I don't think its possible to do what I asked at this point, but if you keep it local, you can do something similar and have more flexibility. The best thing to do is load the contents you need inside the local page. In my case, I need the whole site, including all things in the head, so I used an iframe. Keep in mind that the iframe won't be able to access the window above due to different domains, so what I did was setup an onload event in the local page to check the iframe changes. When it had the URL I was looking for, I would handle differently and load a different page in the local app.

Here is an example. I am using jQuery with this and setup so that the URL's to check for are /app/LOCALPAGEPATH. So if the URL found is /app/index.html it would go to index.html.

$('iframe').load(function(){            
    var url = $(this).get(0).contentWindow.location.href;
    var appIndex = url.indexOf('/app/');
    if (appIndex > -1) {
        var appURL = url.substr(appIndex+5);
        window.location.href = appURL;
    }
});