4
votes

I'm running into a bit of trouble trying to call my native iOS application from my web app (apple-mobile-web-app-capable). Whenever I'm in Safari pressing the button to open my app with a custom url scheme, that works just fine.

However, when I've added it to the home screen I get stuck with the error: The URL can't be shown. Redirecting to http or https works fine but if I call mysupercustomurlscheme:// I get the error message above.

I've tried opening it by document.location.href, window.location, etc etc but nothing seems to do the trick and I've run out of ideas.

If anyone has got any ideas I'd be most grateful to hear them.

Thanks in advance!

2

2 Answers

1
votes

Okay, here's a somewhat clumsy way to do it, but it works and might help some poor soul out there trying to achieve the same thing.

First, create a simple HTML link as, apparently, regular HTML links open in Mobile Safari instead of within the full screen view in the web app. Link

In redirect.html you simply redirect the user with some simple javascript. window.location = "mysupercustomurlscheme://"

And that's it! It's certainly not the best way to do it but it's 'fairly' seamless. That's what I came up with at least, if you have any other suggestions do let me know.

Hope this helps someone!

1
votes

Just wanted to post an example of what Tobias is referencing. You need to host on your server and link to in emails, social media, etc. Simply substitute in your app's URI and your App Store link. Note that the iframe works on more browsers.

<!DOCTYPE html>
<html>
    <body>
        <script type="text/javascript">
            window.onload = function() {
                // Deep link to your app goes here
                document.getElementById("l").src = "my_app://";

                setTimeout(function() {
                    // Link to the App Store should go here -- only fires if deep link fails                
                    window.location = "https://itunes.apple.com/us/app/my.app/id123456789?ls=1&mt=8";
                }, 500);
            };
        </script>
        <iframe id="l" width="1" height="1" style="visibility:hidden"></iframe>
    </body>
</html>

So, if the user has your app installed, the link with the URI will succeed and you will exist the browser before the script for redirecting to the App Store can be triggered. If the user does not have your app, the redirect succeeds (after a brief ugly error message). I am a developer at Branch and we use this, so feel free to reach out with questions in implementing.