Javascript regular expression to add protocol to url string

Question

I have an application to list some website details using JavaScript. There will be a link to website which is generated using JavaScript itself. Sometimes I will get my link as,

<a href="http://www.google.com">Website</a>

But sometimes it will be,

<a href="www.yahoo.com">Website</a>

In the second time the link is not working, there is no protocol.

So I am looking for a JavaScript regular expression function to add http:// if there in no protocol.

My code looks like,

var website_link = document.createElement("a"); 
website_link.innerHTML = "Website"; 
website_link.href = my_JSON_object.website;
website_link.target = "_blank"; 
profile.appendChild(website_link);

And no local links will come.

^www. replace with ^www ? though therer are sub-domain urls that have no www :) — Tomer W
– Tomer W, Commented Aug 5, 2013 at 7:42
You're trying to fix the problem too late. It's impossible to tell if "www.yahoo.com" is a local file (maybe missing) or a bad URL. — Denys Séguret
– Denys Séguret, Commented Aug 5, 2013 at 7:50

ostapische · Accepted Answer · 2013-08-05 08:29:48Z

11

See this link.

function setHttp(link) {
    if (link.search(/^http[s]?\:\/\//) == -1) {
        link = 'http://' + link;
    }
    return link;
}
alert(setHttp("www.google.com"));
alert(setHttp("http://www.google.com/"));

In your code it will be like:

var website_link = document.createElement("a"); 
website_link.innerHTML = "Website";
if (my_JSON_object.website.search(/^http[s]?\:\/\//) == -1) {
    my_JSON_object.website = 'http://' + my_JSON_object.website;
}
website_link.href = my_JSON_object.website;
website_link.target = "_blank"; 
profile.appendChild(website_link);

answered Aug 5, 2013 at 8:29

ostapische

1,5922 gold badges12 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

mishik · Accepted Answer · 2013-08-05 07:43:53Z

1

For example, using negative lookahead:

your_string.replace(/href="(?!http)/, 'href="http://');

Example:

> '<a href="www.yahoo.com">Website</a>'.replace(/href="(?!http)/, 'href="http://');
"<a href="http://www.yahoo.com">Website</a>"
> '<a href="http://www.yahoo.com">Website</a>'.replace(/href="(?!http)/, 'href="http://');
"<a href="http://www.yahoo.com">Website</a>"

answered Aug 5, 2013 at 7:43

mishik

10k9 gold badges48 silver badges69 bronze badges

3 Comments

mishik Over a year ago

There will be a link to website which is generated using JavaScript itself. From this I get - no local links

Anshad Vattapoyil Over a year ago

My code looks like, var website_link = document.createElement("a"); website_link.innerHTML = "Website"; website_link.href = my_JSON_object.website website_link.target = "_blank"; profile.appendChild(website_link); and no local links.

mishik Over a year ago

I don't see where you are trying the code. You need to apply replace command to my_JSON_object.website.

vovacodes · Accepted Answer · 2015-03-15 19:22:38Z

I've wrapped this functionality into the NPM module url-schemify:

var schemify = require('url-schemify');
var assert = require('assert');

// url-schemify adds default scheme (http) to the URLs that miss it

assert.equal(schemify('google.com'), 'http://google.com');
assert.equal(schemify('www.example.com'), 'http://www.example.com');

// default scheme could be configured through the options parameter

assert.equal(schemify('google.com', { scheme: 'https' }), 'https://google.com');
// { scheme: '' } will produce protocol-related URL
assert.equal(schemify('www.example.com', { scheme: '' }), '//www.example.com');

// url-schemify doesn't modify URLs that already have scheme or protocol-related ones:

assert.equal(schemify('http://google.com'), 'http://google.com');
assert.equal(schemify('https://www.example.com'), 'https://www.example.com');
assert.equal(schemify('ftp://example.com'), 'ftp://example.com');
assert.equal(schemify('//example.com'), '//example.com');

Collectives™ on Stack Overflow

Javascript regular expression to add protocol to url string

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related