;

How to Validate the URL in Javascript

Tutorialsrack 12/02/2021 Javascript

In this article, you will learn how to validate the URL in javascript. There are various ways to validate the URL. In this article, we validate the URL using regular expressions. I found these two regexes helpful for me.

The first regex is:

Code - First Regex for Validating URL
 var regexp =  /^(?:(?:https?|ftp):\/\/)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,})))(?::\d{2,5})?(?:\/\S*)?$/;

And this is the second regex:

Code - Second Regex for Validating URL
var expression = /[-a-zA-Z0-9@:%_\+.~#?&//=]{2,256}\.[a-z]{2,4}\b(\/[-a-zA-Z0-9@:%_\+.~#?&//=]*)?/gi

Here are the examples of how to validate the URL using Javascript

Example 1: Using First Regex

Example 1: Using First Regex
function isValidURL(str) {
    var regexp = /^(?:(?:https?|ftp):\/\/)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,})))(?::\d{2,5})?(?:\/\S*)?$/;
    if (regexp.test(str)) {
        return true;
    } else {
        return false;
    }
}

var testCase1 = "http://www.example.com";
console.log(isValidURL(testCase1)); // return true

var testCase2 = "https://www.example.com";
console.log(isValidURL(testCase2)); // return true

var testCase3 = "www.example.com";
console.log(isValidURL(testCase3)); // return true

var testCase4 = "example.com";
console.log(isValidURL(testCase4)); // return true

var testCase5 = "example.io";
console.log(isValidURL(testCase5)); // return true

var testCase6 = "https://localhost:80";
console.log(isValidURL(testCase6)); // return false

var testCase7 = "http://en.wikipedia.org/wiki/Procter_&_Gamble";
console.log(isValidURL(testCase7)); // return true

var testCase8 =
    "http://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&docid=nIv5rk2GyP3hXM&tbnid=isiOkMe3nCtexM:&ved=0CAUQjRw&url=http%3A%2F%2Fanimalcrossing.wikia.com%2Fwiki%2FLion&ei=ygZXU_2fGKbMsQTf4YLgAQ&bvm=bv.65177938,d.aWc&psig=AFQjCNEpBfKnal9kU7Zu4n7RnEt2nerN4g&ust=1398298682009707";
console.log(isValidURL(testCase8)); // return true

var testCase9 = "https://sdfasd";
console.log(isValidURL(testCase9)); // return false

var testCase10 = "dfdsfdsfdfdsfsdfs";
console.log(isValidURL(testCase10)); // return false

var testCase11 = "magnet:?xt=urn:btih:123";
console.log(isValidURL(testCase11)); // return false

var testCase12 = "https://stackoverflow.com/";
console.log(isValidURL(testCase12)); // return true

var testCase13 = "https://w";
console.log(isValidURL(testCase13)); // return false

Example 2: Using Second Regex

Example 2: Using Second Regex
function isValidURL(value) {
    var expression = /[-a-zA-Z0-9@:%_\+.~#?&//=]{2,256}\.[a-z]{2,4}\b(\/[-a-zA-Z0-9@:%_\+.~#?&//=]*)?/gi;
    var regexp = new RegExp(expression);
    return regexp.test(value);
}

var testCase1 = "http://www.example.com";
console.log(isValidURL(testCase1)); // return true

var testCase2 = "https://www.example.com";
console.log(isValidURL(testCase2)); // return true

var testCase3 = "www.example.com";
console.log(isValidURL(testCase3)); // return true

var testCase4 = "example.com";
console.log(isValidURL(testCase4)); // return true

var testCase5 = "example.io";
console.log(isValidURL(testCase5)); // return true

var testCase6 = "https://localhost:80";
console.log(isValidURL(testCase6)); // return false

var testCase7 = "http://en.wikipedia.org/wiki/Procter_&_Gamble";
console.log(isValidURL(testCase7)); // return true

var testCase8 =
    "http://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&docid=nIv5rk2GyP3hXM&tbnid=isiOkMe3nCtexM:&ved=0CAUQjRw&url=http%3A%2F%2Fanimalcrossing.wikia.com%2Fwiki%2FLion&ei=ygZXU_2fGKbMsQTf4YLgAQ&bvm=bv.65177938,d.aWc&psig=AFQjCNEpBfKnal9kU7Zu4n7RnEt2nerN4g&ust=1398298682009707";
console.log(isValidURL(testCase8)); // return true

var testCase9 = "https://sdfasd";
console.log(isValidURL(testCase9)); // return false

var testCase10 = "dfdsfdsfdfdsfsdfs";
console.log(isValidURL(testCase10)); // return false

var testCase11 = "magnet:?xt=urn:btih:123";
console.log(isValidURL(testCase11)); // return false

var testCase12 = "https://stackoverflow.com/";
console.log(isValidURL(testCase12)); // return true

var testCase13 = "https://w";
console.log(isValidURL(testCase13)); // return false

var testCase14 = "https://sdfasdp.ppppppppppp";
console.log(isValidURL(testCase14)); // return false

I hope this article will help you to understand how to validate the URL using the regular expression in Javascript.

Share your valuable feedback, please post your comment at the bottom of this article. Thank you!

Tagged: Javascript Regular Expression in Javascript Data Validation

Related Posts


Comments

Recent Posts
Tags