Check If Url Scheme Is Supported in JavaScript

Check if URL scheme is supported in javascript

No, not from a webpage.

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

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';
}

How to check if url scheme is present in a url string javascript

You can do it quite easily with a little bit of regex. The pattern /^[a-z0-9]+:\/\// will be able to extract it.

If you just want to test if it has it, use pattern.test() to get a boolean:

/^[a-z0-9]+:\/\//.test(url); // true

If you want what it is, use url.match() and wrap the protocol portion in parentheses:

url.match(/^([a-z0-9]+):\/\//)[1] // https

Here is a runnable example with a few example URLs.

const urls = ['file://test.com', 'http://test.com', 'https://test.com', 'example.com?http'];
console.log( urls.map(url => (url.match(/^([a-z0-9]+):\/\//) || [])[1]));

Detecting URI scheme support in-browser

There are a few tricks you can use, but if you have to deal with IE < 11 or even IE 11 on Windows earlier than Windows 8, you won't like my response.

Generally, there is no way to detect support for the URL-scheme if following these URLs has a side-effect.

What you can do is try to open one of these URLs in an iframe. So you would append an iframe to the body (or wherever you want to) and then set its href to the special url.

In Mozilla browsers, you will get an exception if the URL scheme isn't supported. In Webkit based browsers (and Chrome), nothing will happen.

So unless you're on Mozilla, there's not even a way to find out whether why you've done has just worked or not.

In IE11 under Windows 8 and later (but not under earlier versions of Windows - there's the method is just missing), you can use window.natigator.msLaunchUri to launch that special url. This too will throw if the URI scheme is not supported.

Unfortunately, and this might really put a dampener on what you want to do: No matter what trick you use: If the scheme it not supported and you try to launch it on any version of IE that doesn't support msLaunchUri, your page will be replaced by an error page and there is no way to prevent this from happening.

I've tried everything. The iframe trick causes the error message. Trying window.open causes the error message or does nothing depending on the weather. Setting an img URL doesn't cause the error (good) but also doesn't cause the URL to actually be launched (bad).

Unless you have cooperation of the application who's url you're going to launch (for example by telling IE to pollute the User-Agent header if the app is installed), you are out of luck in IE.

Yeah - very likely not what you wanted to hear, I'm sorry.

Check if a URL scheme is registered on iOS or Android in Cordova

Cordova does not ship with this feature. There is a plugin which implements it for iOS, though.

  • https://github.com/philbot5000/CanOpen

I did not find anything for Android yet, but I do not think this would be hard to do in native Android Code. Even if you are not proficient with Objective-C or Java and never intend to write fully native apps, you should learn some basics if you want to build apps with Cordova.

Small and simple plugins are really easy to do. Read the docs and have a look at the code of some simple plugins to see how it is done. For example the source code of the one above or of the one below is really simple and straightforward to understand:

  • https://github.com/EddyVerbruggen/LaunchMyApp-PhoneGap-Plugin


Related Topics



Leave a reply



Submit