Stripping texts in a variable : javascript - javascript

Consider variable like
var url='http://www.example.com/index.php?id=ss';
or
var url='http://www.example.com/dir1/dir2/index.php';
In these variables, i want to get only the domain part i.e http://www.example.com, stripping out other texts. Is this possible in ordinary javascript or jquery ?
Please help

No need to wrangle URL strings. The browser has its own URL parser which you can get access to using the location-like properties of an HTMLAnchorElement:
var a= document.createElement('a');
a.href= 'http://www.example.com/index.php?id=ss';
alert(a.protocol); // http
alert(a.hostname); // www.example.com
alert(a.pathname); // /index.php
alert(a.search); // ?id=ss
// also port, hash

If you want to do this explicitly with URIs then you can use a js URI library for this. A sample library like js-uri
var url=new URI('http://www.example.com/dir1/dir2/index.php');
var sch = uri.scheme // http
var auth = uri.authority // www.example.com

An alternative using substrings and indexOf's :)
/* FUNCTION: getBaseUrl
* DESCRIPTION: Strips a url's sub folders and returns it
* EXAMPLE: getBaseUrl( http://stackoverflow.com/questions
* /3102830/stripping-texts-in-a-variable-javascript );
* returns -- http://stackoverflow.com/
*/
function getBaseUrl( url ) {
if ( url.indexOf('.') == -1 || url.indexOf('/') == -1 ) { return false; }
var result = url.substr(0, url.indexOf( '/' , url.indexOf('.') ) + 1 );
return( result );
}

You can use a RegExp object.

var url='http://www.example.com/index.php?id=ss';
url = url.replace(/^.*?:\/\/(.*?)\/.*$/, "$1");
alert(url);

Related

Javascript return true if a string contains subdomain

I have an API that returns a domain to my front end.
This domain is the string format.
For eg: "google.com" / "google.co.ok"
or "test.google.com"/ "test.google.co.ok:
Notice that the string does not contain any protocol.
I want to write a method that parses the string and returns true if the string contains a subdomain.
In the above 2 examples, the method should return true for test.google.com or test.google.co.ok
EDIT: If it were python, i would write something like below. But hoping something similat was available in JS.
from tld import get_tld, get_fld
get_tld("www.google.co.uk", fix_protocol=True)
# 'co.uk'
get_fld("www.google.co.uk", fix_protocol=True)
# 'google.co.uk'
There are multiple JavaScript libraries available that can be used the same way you're using tld. psl is older but still has millions of weekly downloads.
You could use psl and implement something like this:
import { parse } from "psl";
function hasSubdomain(str) {
const { subdomain } = parse(str);
return subdomain !== null;
}
hasSubdomain("www.google.com") // true
hasSubdomain("google.co.uk") // false
Feel free to clone and edit this example on RunKit as you see fit.
Sure thing. Since there's no protocol, maybe something like:
"word.domain.com"
.split(".").length > 2 // true
"domain.com"
.split(".").length > 2 // false
"www.domain.co.uk"
.split(".").length > 2 // uh-oh
You'll likely need to parse out "www" and second-level domains (".co", ".gc", etc).
You can use RegExp to perform string manipulation. Please take a look at the following snippet and run the code and see the results from different test cases covering most of the possibilities. Let me know if it's helpful.
function subDomain(url) {
// REMOVE LEADING AND TRAILING WHITE SPACE
url = url.replace(new RegExp(/^\s+/), ""); // START
url = url.replace(new RegExp(/\s+$/), ""); // END
// CONVERT BACK SLASHES TO FORWARD SLASHES
url = url.replace(new RegExp(/\\/g), "/");
// REMOVES 'www.' FROM THE START OF THE STRING
url = url.replace(new RegExp(/^www\./i), "");
// REMOVE STRING FROM FIRST FORWARD SLASH ON
url = url.replace(new RegExp(/\/(.*)/), "");
// REMOVES '.??.??' OR '.???.??' FROM END - e.g. '.CO.UK', '.COM.AU'
if (url.match(new RegExp(/\.[a-z]{2,3}\.[a-z]{2}$/i))) {
url = url.replace(new RegExp(/\.[a-z]{2,3}\.[a-z]{2}$/i), "");
// REMOVES '.??' or '.???' or '.????' FROM END - e.g. '.US', '.COM', '.INFO'
} else if (url.match(new RegExp(/\.[a-z]{2,4}$/i))) {
url = url.replace(new RegExp(/\.[a-z]{2,4}$/i), "");
}
// CHECK TO SEE IF THERE IS A DOT '.' LEFT
var subDomain = url.match(new RegExp(/\./g)) ? true : false;
return subDomain;
}
const subdomainInput = "test.google.com";
const subdomainInputWithPath = "test.google.com/test";
const subdomainInputWithPathWithWS = " test.google.com ";
const subdomainInputWithWS = " test.google.com ";
const subdomainInputWithQueryString = "test.google.com/test?token=33333";
const noSubInput = "google.com"
const noSubInputWithPath = "google.com/search"
const noSubInputWithPathWithQueryString = "google.com/search?token=ttttttt"
console.log("Test Run\n")
conosle.log("With subdomain test cases")
console.log(`subdomainInput: ${subDomain(subdomainInput)}`);
console.log(`subdomainInputWithPath: ${subDomain(subdomainInputWithPath)}`);
console.log(`subdomainInputWithWS: ${subDomain(subdomainInputWithWS)}`);
console.log(`subdomainInputWithPathWithWS: ${subDomain(subdomainInputWithPathWithWS)}`);
console.log(`subdomainInputWithQueryString: ${subDomain(subdomainInputWithQueryString)}`);
conosle.log("Without subdomain test cases")
console.log(`noSubInput: ${subDomain(noSubInput)}`);
console.log(`noSubInput: ${subDomain(noSubInput)}`);
console.log(`noSubInputWithPath: ${subDomain(noSubInputWithPath)}`);
console.log(`noSubInputWithPathWithQueryString: ${subDomain(noSubInputWithPathWithQueryString)}`);
return(subDomain);
}

Replace a value between stings [ url parameter ] in different conditions

i want to modify url values based on some condition
(1)If my current url is http://example.com
then i have to add ?order=new to the url for this i write the following code and it is working
var url=window.location.href;
url=url+"order=new";
(2)If my current url is http://example.com/?class=1
then i have to add &order=new to the url for this i write the following code and it is working
var url=window.location.href;
if(url.indexOf("class=") >= 0){
url=url+"&order=new";
}
(3)If my current url is http://example.com/?class=1&order=new
then i have to add &order=date to the url for this i write the following code and it is working
var url=window.location.href;
if (url.indexOf("order=") >=0){
url= url.split("order=")[0]+"order=date";
}
(4) If my curent url is http://example.com/?class=anyvalue&div=anyvalue&order=anyvalue or http://example.com/?class=anyvalue&order=anyvalue&div=anyvalue. Here how can i replace order value ?
ie
http://example.com/?class=anyvalue&div=anyvalue&order=anything
http://example.com/?class=anyvalue&order=anything&div=anyvalue
Please support
Use URL
var url = window.location.href;
var urlObj = new URL( url );
Now you can search parameters of the URL
var order = urlObj.searchParams.get("order");
if ( !order )
{
//url += url.contains( "?" ) ? "&order=new" : "?order=new";
//contains didnt work so used includes instead
url += url.includes( "?" ) ? "&order=new" : "?order=new";
}
Similarly, you can replace value as well
var order = urlObj.searchParams.get("order");
if ( order )
{
urlObj.searchParams.set("order", "123");
}
console.log( urlObj.href );
Update:
added jsfiddle to your solution :)...
jsfiddle link
As far as I can say, I think you want this:
var url = 'http://example.com/?class=anyvalue&order=anything&div=anyvalue';
if (url.indexOf("order=") >= 0 && url.indexOf('div=') >= 0){
newUrl = url.replace('order=anything', 'order=456');
}
using replace() function. Change the url to what you are using.

Remove empty querystring [duplicate]

What is an easy way to remove the querystring from a Path in Javascript?
I have seen a plugin for Jquery that uses window.location.search. I can not do that: The URL in my case is a variable that is set from AJAX.
var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3&SortOrder=dsc'
An easy way to get this is:
function getPathFromUrl(url) {
return url.split("?")[0];
}
For those who also wish to remove the hash (not part of the original question) when no querystring exists, that requires a little bit more:
function stripQueryStringAndHashFromPath(url) {
return url.split("?")[0].split("#")[0];
}
EDIT
#caub (originally #crl) suggested a simpler combo that works for both query string and hash (though it uses RegExp, in case anyone has a problem with that):
function getPathFromUrl(url) {
return url.split(/[?#]/)[0];
}
2nd Update: In attempt to provide a comprehensive answer, I am benchmarking the three methods proposed in the various answers.
var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3';
var i;
// Testing the substring method
i = 0;
console.time('10k substring');
while (i < 10000) {
testURL.substring(0, testURL.indexOf('?'));
i++;
}
console.timeEnd('10k substring');
// Testing the split method
i = 0;
console.time('10k split');
while (i < 10000) {
testURL.split('?')[0];
i++;
}
console.timeEnd('10k split');
// Testing the RegEx method
i = 0;
var re = new RegExp("[^?]+");
console.time('10k regex');
while (i < 10000) {
testURL.match(re)[0];
i++;
}
console.timeEnd('10k regex');
Results in Firefox 3.5.8 on Mac OS X 10.6.2:
10k substring: 16ms
10k split: 25ms
10k regex: 44ms
Results in Chrome 5.0.307.11 on Mac OS X 10.6.2:
10k substring: 14ms
10k split: 20ms
10k regex: 15ms
Note that the substring method is inferior in functionality as it returns a blank string if the URL does not contain a querystring. The other two methods would return the full URL, as expected. However it is interesting to note that the substring method is the fastest, especially in Firefox.
1st UPDATE: Actually the split() method suggested by Robusto is a better solution that the one I suggested earlier, since it will work even when there is no querystring:
var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3';
testURL.split('?')[0]; // Returns: "/Products/List"
var testURL2 = '/Products/List';
testURL2.split('?')[0]; // Returns: "/Products/List"
Original Answer:
var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3';
testURL.substring(0, testURL.indexOf('?')); // Returns: "/Products/List"
This may be an old question but I have tried this method to remove query params. Seems to work smoothly for me as I needed a reload as well combined with removing of query params.
window.location.href = window.location.origin + window.location.pathname;
Also since I am using simple string addition operation I am guessing the performance will be good. But Still worth comparing with snippets in this answer
var u = new URL('https://server.de/test?q#h')
u.hash = ''
u.search = ''
console.log(u.toString())
var path = "path/to/myfile.png?foo=bar#hash";
console.log(
path.replace(/(\?.*)|(#.*)/g, "")
);
I can understand how painful things were before, In modern days you can get this super easily like below
let url = new URL('https://example.com?foo=1&bar=2&foo=3');
let params = new URLSearchParams(url.search);
// Delete the foo parameter.
params.delete('foo'); //Query string is now: 'bar=2'
// now join the query param and host
let newUrl = url.origin + '/' + params.toString();
A simple way is you can do as follows
public static String stripQueryStringAndHashFromPath(String uri) {
return uri.replaceAll(("(\\?.*|\\#.*)"), "");
}
An approach using the standard URL:
/**
* #param {string} path - A path starting with "/"
* #return {string}
*/
function getPathname(path) {
return new URL(`http://_${path}`).pathname
}
getPathname('/foo/bar?cat=5') // /foo/bar
If you're into RegEx....
var newURL = testURL.match(new RegExp("[^?]+"))
If using backbone.js (which contains url anchor as route), url query string may appear:
before url anchor:
var url = 'http://example.com?a=1&b=3#routepath/subpath';
after url anchor:
var url = 'http://example.com#routepath/subpath?a=1&b=3';
Solution:
window.location.href.replace(window.location.search, '');
// run as: 'http://example.com#routepath/subpath?a=1&b=3'.replace('?a=1&b=3', '');
If you need to perform complex operation on URL, you can take a look to the jQuery url parser plugin.

Check if a string starts with http using Javascript

I've been searching all over for an answer to this and all of the answers I've found haven't been in JavaScript.
I need a way, in javascript, to check if a string starts with http, https, or ftp. If it doesn't start with one of those I need to prepend the string with http://. indexOf won't work for me I don't think as I need either http, https or ftp. Also I don't want something like google.com/?q=http://google.com to trigger that as being valid as it doesn't start with an http whereas indexOf would trigger that as being true (if I'm not entirely mistaken).
The closest PHP regex I've found is this:
function addhttp($url) {
if (!preg_match("~^(?:f|ht)tps?://~i", $url)) {
$url = "http://" . $url;
}
return $url;
}
Source: How to add http if its not exists in the url
I just don't know how to convert that to javascript. Any help would be greatly appreciated.
export const getValidUrl = (url = "") => {
let newUrl = window.decodeURIComponent(url);
newUrl = newUrl.trim().replace(/\s/g, "");
if(/^(:\/\/)/.test(newUrl)){
return `http${newUrl}`;
}
if(!/^(f|ht)tps?:\/\//i.test(newUrl)){
return `http://${newUrl}`;
}
return newUrl;
};
Tests:
expect(getValidUrl('https://www.test.com')).toBe('https://www.test.com');
expect(getValidUrl('http://www.test.com')).toBe('http://www.test.com');
expect(getValidUrl(' http : / / www.test.com')).toBe('http://www.test.com');
expect(getValidUrl('ftp://www.test.com')).toBe('ftp://www.test.com');
expect(getValidUrl('www.test.com')).toBe('http://www.test.com');
expect(getValidUrl('://www.test.com')).toBe('http://www.test.com');
expect(getValidUrl('http%3A%2F%2Fwww.test.com')).toBe('http://www.test.com');
expect(getValidUrl('www . test.com')).toBe('http://www.test.com');
This should work:
var pattern = /^((http|https|ftp):\/\/)/;
if(!pattern.test(url)) {
url = "http://" + url;
}
jsFiddle
var url = "http://something.com"
if( url.indexOf("http") == 0 ) {
alert("yeah!");
} else {
alert("No no no!");
}
Non-Regex declarative way:
const hasValidUrlProtocol = (url = '') =>
['http://', 'https://', 'ftp://'].some(protocol => url.startsWith(protocol))
This should work:
var re = /^(http|https|ftp)/
Refining previous answers a bit more, I used new RegExp(...) to avoid messy escapes, and also added an optional s.
var pattern = new RegExp('^(https?|ftp)://');
if(!pattern.test(url)) {
url = "http://" + url;
}
var pattern = new RegExp('^(https?|ftp)://');
console.log(pattern.test('http://foo'));
console.log(pattern.test('https://foo'));
console.log(pattern.test('ftp://foo'));
console.log(pattern.test('bar'));
Best readability I'd say is to use .startsWith('theString').
The code below checks for both http://, https:// and ftp:// and sets okUrl to a boolean true if any of them comply, by using the || which means or.
When you know if the url contains none of those strings, then just just add http:// to the start of the string either with literals (${})
let url = 'google.com'
const urlOK = url.startsWith('http://') || url.startsWith('https://') || url.startsWith('ftp://')
if (!urlOk) url = `http://${url}`
// => 'http://google.com'
or with simple string concat, which can be done in various ways, for example:
url = 'http://' + url
Read more about it, and test it, here:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith

remove url parameters with javascript or jquery

I am trying to use the youtube data api to generate a video playlist.
However, the video urls require a format of:
youtube.com/watch?v=3sZOD3xKL0Y
but what the api generates is:
youtube.com/watch?v=3sZOD3xKL0Y&feature=youtube_gdata
So what I need to do is be able to select everything after and including the ampersand(&) and remove it from the url.
Any way to do this with javascript and some sort of regular expression?
What am I missing?
Why not:
url.split('?')[0]
Hmm... Looking for better way... here it is
var onlyUrl = window.location.href.replace(window.location.search,'');
Example: http://jsfiddle.net/SjrqF/
var url = 'youtube.com/watch?v=3sZOD3xKL0Y&feature=youtube_gdata';
url = url.slice( 0, url.indexOf('&') );
or:
Example: http://jsfiddle.net/SjrqF/1/
var url = 'youtube.com/watch?v=3sZOD3xKL0Y&feature=youtube_gdata';
url = url.split( '&' )[0];
Use this function:
var getCleanUrl = function(url) {
return url.replace(/#.*$/, '').replace(/\?.*$/, '');
};
// get rid of hash and params
console.log(getCleanUrl('https://sidanmor.com/?firstname=idan&lastname=mor'));
If you want all the href parts, use this:
var url = document.createElement('a');
url.href = 'https://developer.mozilla.org/en-US/search?q=URL#search-results-close-container';
console.log(url.href); // https://developer.mozilla.org/en-US/search?q=URL#search-results-close-container
console.log(url.protocol); // https:
console.log(url.host); // developer.mozilla.org
console.log(url.hostname); // developer.mozilla.org
console.log(url.port); // (blank - https assumes port 443)
console.log(url.pathname); // /en-US/search
console.log(url.search); // ?q=URL
console.log(url.hash); // #search-results-close-container
console.log(url.origin); // https://developer.mozilla.org
//user113716 code is working but i altered as below. it will work if your URL contain "?" mark or not
//replace URL in browser
if(window.location.href.indexOf("?") > -1) {
var newUrl = refineUrl();
window.history.pushState("object or string", "Title", "/"+newUrl );
}
function refineUrl()
{
//get full url
var url = window.location.href;
//get url after/
var value = url = url.slice( 0, url.indexOf('?') );
//get the part after before ?
value = value.replace('#System.Web.Configuration.WebConfigurationManager.AppSettings["BaseURL"]','');
return value;
}
This worked for me:
window.location.replace(window.location.pathname)
No splits.. :) The correct/foolproof way is to let the native browser BUILT-IN functions do the heavy lifting using urlParams, the heavy lifting is done for you.
//summary answer - this one line will correctly replace in all current browsers
window.history.replaceState({}, '', `${location.pathname}?${params}`);
// 1 Get your URL
let url = new URL('https://tykt.org?unicorn=1&printer=2&scanner=3');
console.log("URL: "+ url.toString());
// 2 get your params
let params = new URLSearchParams(url.search);
console.log("querys: " + params.toString());
// 3 Delete the printer param, Query string is now gone
params.delete('printer');
console.log("Printer Removed: " + params.toString());
// BELOW = Add it back to the URL, DONE!
___________
NOW Putting it all together in your live browser
// Above is a breakdown of how to get your params
// 4 then you simply replace those in your current browser!!
window.history.replaceState({}, '', `${location.pathname}?${params}`);
Sample working Javascript Fiddle here
You could use a RegEx to match the value of v and build the URL yourself since you know the URL is youtube.com/watch?v=...
http://jsfiddle.net/akURz/
var url = 'http://youtube.com/watch?v=3sZOD3xKL0Y';
alert(url.match(/v\=([a-z0-9]+)/i));
Well, I am using this:
stripUrl(urlToStrip){
let stripped = urlToStrip.split('?')[0];
stripped = stripped.split('&')[0];
stripped = stripped.split('#')[0];
return stripped;
}
or:
stripUrl(urlToStrip){
return urlToStrip.split('?')[0].split('&')[0].split('#')[0];
}
For example we have:
example.com/list/search?q=Somethink
And you need use variable url like this by window.location.href:
example.com/list/edit
From url:
example.com/list/search?q=Somethink
example.com/list/
var url = (window.location.href);
url = url.split('/search')[0];
url = (url + '/edit');
This is simple solution:-)

Categories

Resources