How to detect if a link works?

Question

I need to know if a link will open.

a conversation is here http://stackoverflow.com/questions/13044805/how-to-check-if-an-app-is-installed-from-a-web-page-on-an-iphone — Bechir, Jan 23 '14 at 10:57

score 9 · Accepted Answer · edited May 23 '17 at 11:59

9

See Maximilian Hoffmann's answer for a more robust solution.

An approach like this is common - hijack the timeout to redirect to a different URL. Would this approach work for you?

<a id="applink" href="comgooglemaps://?q=Red+Lobster+Billings">Show map</a>

<script type="text/javascript">

var backup = "http://maps.google.com/?q=Red+Lobster+Billings";

function applink(fail){
    return function() {
        var clickedAt = +new Date;
        setTimeout(function(){
            if (+new Date - clickedAt < 2000){
                window.location = fail;
            }
        }, 500);    
    };
}

document.getElementById("applink").onclick = applink(backup);

</script>

edited May 23 '17 at 11:59

Community

1
1

answered Feb 04 '14 at 04:00

Aaron Brager

65,323
19
161
287

This could probably be useful if I can't accomplish what I'm thinking of, but what I really would like to be able to do is determine whether the link is going to launch the app (AKA whether the app is installed) before the user taps on the link. I'm thinking executing some javascript on page load could possibly work for this. Any thoughts? I hope I have been clear enough... – novicePrgrmr Feb 04 '14 at 14:28
There's no interface for asking if a link will work… you can only try it and handle what happens as a result (unfortunately). You could submit a Mobile Safari enhancement request at bugreport.apple.com, but I imagine this would open the door up to a number of privacy issues, which is why Apple doesn't allow it. – Aaron Brager Feb 04 '14 at 15:51
Would this solution prevent the timeout from popping up? If it is, then it's the correct solution. – novicePrgrmr Feb 15 '14 at 16:25
Hi Aaron, I just tried the code in JSFiddle, and it didn't seem to do anything. Am I doing anything wrong? http://jsfiddle.net/erea/5APKE/2/ – novicePrgrmr Feb 15 '14 at 16:37
This redirects to the `fail` url even when the Google Maps app is installed. It does both. – awe Dec 19 '14 at 13:41
__This does not work__. I added [__the solution__](http://stackoverflow.com/questions/21199850/how-to-programatically-detect-if-a-google-maps-ios-url-scheme-url-will-open/29525678#29525678) below. – Max Hoffmann Apr 08 '15 at 21:31

score 4 · Answer 2 · answered Apr 08 '15 at 21:27

The solution is adding an iframe with the URL scheme to your page. It silently fails if the app is not installed, so you need to check via a timer if opening the app worked or not.

// detect iOS
if (['iPhone', 'iPad'].indexOf(navigator.platform) > -1) {

  // create iframe with an Apple URL scheme
  var iframe = document.createElement('iframe');
  iframe.src = 'twitter://';

  // hide iframe visually
  iframe.width = 0;
  iframe.height = 0;
  iframe.frameBorder = 0;

  // get timestamp before trying to open the app
  var beforeSwitch = Date.now();

  // schedule check if app was opened
  setTimeout(function() {
    // if this is called after less than 30ms
    if (Date.now() - beforeSwitch < 30) {

      // do something as a fallback

    }
  });

  // add iframe to trigger opening the app
  document.body.appendChild(iframe);
  // directly remove it again
  iframe.parentNode.removeChild(iframe);
}

I wrote a post with a more detailed example that uses this approach to open the twitter app on iOS if installed.

This is better than my answer. I updated my answer to link to this one. — Aaron Brager, May 20 '15 at 14:16

score 0 · Answer 3 · answered Feb 06 '14 at 18:45

There isn't a way for you to know if a link will work but there is for Safari with something called Smart App Banners

enter image description here

<!DOCTYPE html>
<html>
<head>
<meta name="Google Maps" content="app-id=585027354"/> 
</head>

<body>
The content of the document......
</body>

</html>

What it basically does is checking if an app is installed. If it's not installed the user will be directed to the app store. If it's installed the user will be able to open the app from the website with the relevant data you'd be normally passing using the url scheme. You could use if for Google Maps.

The down side of this is that it will only work on Safari but it's still better than nothing.

How to detect if a link works?

3 Answers3

Linked