Search code examples
javascriptinternet-explorergoogle-chromefirefoxurl-scheme

JavaScript - how to detect if the Custom URL scheme is available or not available?


In Windows operating system i have a custom URI scheme, which is used from

IE, Firefox, Opera, Safari, Google Chrome

to launch Juniper router VPN SSH client (like Cisco). Basically it works as below if the SSH Client is installed, from the web page VPN SSH Client can be launched.

<a href="juniper:open"> VPN SSH Client </a>

Problem:

sometimes the user did not installed the Juniper router SSH client application from the CD/DVD box, therefore the juniper:open does nothing.

So in that case, i need to detect weather or not the URL scheme is available.

Therefore, I tried Javascript method but its not working exactly. because the juniper:open is actually not web link.

How do i then detect it please?

<script>
// Fails
function test1(){
  window.location = 'juniper:open';
  setTimeout(function(){
    if(confirm('Missing. Download it now?')){
      document.location = 'https://www.junper-affiliate.com/setup.zip';
    }
  }, 25);

  //document.location = 'juniper:open';
}

// Fails
function test2(h){
  document.location=h;
  var time = (new Date()).getTime();
  setTimeout(function(){
   var now = (new Date()).getTime();
   if((now-time)<400) {
    if(confirm('Missing. Download it now?')){
     document.location = 'https://www.junper-affiliate.com/setup.zip';
    } else {
     document.location=h;
    }
   }
  }, 300);
 }
</script>

Then:

<a onclick="test1()">TEST 1</a>
<a href="juniper:open" onclick="test2(this.href);return false;">TEST 2</a>

Solution

  • EDIT Following suggestions in comments:

    function goto(url, fallback) {
        var script = document.createElement('script'); 
    
        script.onload = function() { 
            document.location = url;
        } 
        script.onerror = function() { 
            document.location = fallback;
        } 
        script.setAttribute('src', url); 
    
        document.getElementsByTagName('head')[0].appendChild(script);
    
    }
    

    and

    <a href="javascript:" onclick="goto('juniper:open', 'https://www.junper-affiliate.com/setup.zip');">TEST 2</a> 
    

    The price you have to pay, is a duplicated request for the page.

    EDIT

    This is a good workaround for same-origin policy, which prevents an async version using XMLHTTPRequest to work properly, since SOP restricts cross-domain requests to http and juniper:open would therefore always fail.

    function goto(url, fallback) {
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.open('GET', url, false);
        try {
            xmlhttp.send(null);                  // Send the request now
        } catch (e) {
            document.location = fallback;
            return;
        }
    
        // Throw an error if the request was not 200 OK 
        if (xmlhttp.status === 200) {
            document.location = url;
        } else {
            document.location = fallback;
        }
    }
    

    EDIT

    The initial solution below doesn't actually work 'cause no exception is being thrown if the protocol is not supported.

      try {
        document.location = 'juniper:open';
      } catch (e) {
        document.location = 'https://www.junper-affiliate.com/setup.zip';
      }