making relative url absolute using arbitrary root in javascript - javascript

Assuming that I'm on a page on a different domain (mydomain.com) and that the relative url only exists in code (not in the DOM)
How do I combine two arbitrary urls entirely in javascript?
var a = 'http://example.com/some/path/';
var b = '../other/path/';
var c = magicUrlCombine(a,b);
assert(c == 'http://example.com/some/other/path/');
It should also work for
var a = 'http://example.com/some/path/';
var b = 'http://pink-unicorns.com/some/other/path/';
var c = magicUrlCombine(a,b);
assert(c == 'http://pink-unicorns.com/some/other/path/');
EDIT:
I'm looking for a completely general function for combining an absolute url with an arbitrary url. The same logic as the browser uses for resolving links but for urls that are not in the HTML of the page and/or not relative to the current location.href.
var a = 'http://example.com/a/b/c/';
var b = '../d/e/';
assert(c == 'http://example.com/a/b/d/e/')
OR
var b = '/f/g/';
assert(c == 'http://example.com/f/g/')
OR
var b = 'http://jquery.com/h/i/';
assert(c == 'http://jquery.com/h/i/')
EDIT 2:
node.js has a url module that has the right functionality, but I haven't found a nice way of reusing it on the client side. (how to use node.js module system on the clientside)
I managed to hack my way through making it work but it's not really a solution I feel comfortable putting into a production site. Hackety hack

JQuery Mobile has it
$.mobile.path.makeUrlAbsolute(relPath, absPath)
console.log($.mobile.path.makeUrlAbsolute('../d/e/', 'http://example.com/a/b/c/'));
console.log($.mobile.path.makeUrlAbsolute('/f/g/', 'http://example.com/a/b/c/'));
console.log($.mobile.path.makeUrlAbsolute('http://jquery.com/h/i/', 'http://example.com/a/b/c/'));
all give the expected results

I have used on the server side, using NodeJS,
var url = require('url');
url.resolve(from, to);
in your case:
var a = 'http://example.com/some/path/';
var b = '../other/path/';
var c = url.resolve(a, b);
assert(c == 'http://example.com/some/other/path/');
var a = 'http://example.com/some/path/';
var b = 'http://pink-unicorns.com/some/other/path/';
var c = url.resolve(a, b);
assert(c == 'http://pink-unicorns.com/some/other/path/');

Couldn't resist having a go at a solution
var magicUrlCombine = function(a,b){
return (a + b).replace(/[\w\-\.]+\/..\/|\:\/\/[\w\-\.\/]+http/g,'');
}
works for both test cases and combinations of the two
http://jsfiddle.net/8HLeQ/2/

I assumed I understood the question but my fiddle returns two false. The examples are not obvious
http://jsfiddle.net/mplungjan/z5SUn/
function magicUrlCombine(a,b) {
var linkA = document.createElement('a');
linkA.href = a;
var linkB = document.createElement('a');
linkB.href = b;
return linkB.href.replace(linkB.host,linkA.host)
}

This is a possible, but untested, solution:
function magicCombine(a,b){
if(b.indexOf('://') != -1) return b;
var backs = 0;
var lastIndex = b.indexOf('../');
while(lastIndex != -1){
backs++;
lastIndex = b.indexOf('../', lastIndex+3);
}
var URL = a.split('/');
//Remove last part of URL array, which is always either the file name or [BLANK]
URL.splice(URL.length-1, 1)
if(b.substr(0,1) == '/')
b = b.substr(1);
var toAdd = b.split('/');
for(var i = 0, c = toAdd.length-backs; i < c; ++i){
if(i < backs)
URL[URL.length - (backs-i)] = toAdd[backs+i];
else
URL.push(toAdd[backs+i]);
}
return URL.join('/');
}
Should take care of both cases...

Related

Javascript pull data from string?

I have a long URL that contains some data that I need to pull. I am able to get the end of the URL by doing this:
var data = window.location.hash;
When I do alert(data); I receive a long string like this:
#access_token=0u2389ruq892hqjru3h289r3u892ru3892r32235423&token_type=Bearer&expires_in=3600
note in the example the access token is not valid, just random numbers I input for example purpose
Now that I have that long string stored in a variable, how can I parse out just the access token value, so everything in between the first '=' and '&. So this is what I need out of the string:
0u2389ruq892hqjru3h289r3u892ru3892r32235423
I was reading up on php explode, and others java script specific stuff like strip but couldn't get them to function as needed. Thanks guys.
DEMO (look in your debug console)
You will want to split the string by the token '&' first to get your key/value pairs:
var kvpairs = document.location.hash.substring(1).split('&');
Then, you will want to split each kvpair into a key and a value:
for (var i = 0; i < kvpairs.length; i++) {
var kvpair = kvpairs[i].split('=');
var k = kvpair[0];
var v = kvpair[1];
if (k != 'access_token')
continue;
console.log(v); //Here's your access token.
}
Here is a version wrapped into a function that you can use easily:
function getParam(hash, key) {
var kvpairs = hash.substring(1).split('&');
for (var i = 0; i < kvpairs.length; i++) {
var kvpair = kvpairs[i].split('=');
var k = kvpair[0];
var v = kvpair[1];
if (k != key)
continue;
return v;
}
return null;
}
Usage:
getParam(document.location.hash, 'access_token');
data.split("&")[0].split("=")[1]
var str = "#access_token=0u2389ruq892hqjru3h289r3u892ru3892r32235423&token_type=Bearer&expires_in=3600";
var requiredValue = str.split('&')[0].split('=')[1];
I'd use regex in case value=key pair changes position
var data = "#token_type=Bearer&access_token=0u2389ruq892hqjru3h289r3u892ru3892r32235423&expires_in=3600";
RegExp("access_token=([A-Za-z0-9]*)&").exec(data)[1];
output
"0u2389ruq892hqjru3h289r3u892ru3892r32235423"
Looks like I'm a bit late on this. Here's my attempt at a version that parses URL parameters into a map and gets any param by name.
var str = "#access_token=0u2389ruq892hqjru3h289r3u892ru3892r32235423&token_type=Bearer&expires_in=3600";
function urlToMap(url){
var startIndex = Math.max(url.lastIndexOf("#"), url.lastIndexOf("?"));
url = url.substr(startIndex+1);
var result = {};
url.split("&").forEach(function(pair){
var x = pair.split("=");
result[x[0]]=x[1];
});
return result;
}
function getParam(url, name){
return urlToMap(url)[name];
}
console.log(getParam(str, "access_token"));
To answer to your question directly (what's between this and that), you would need to use indexOf and substring functions.
Here's a little piece of code for you.
function whatsBetween (_strToSearch, _leftText, _rightText) {
var leftPos = _strToSearch.indexOf(_leftText) + _leftText.length;
var rightPos = _strToSearch.indexOf(_rightText, leftPos);
if (leftPos >= 0 && leftPos < rightPos)
return _strToSearch.substring(leftPos, rightPos);
return "";
}
Usage:
alert(whatsBetween, data,"=","#");
That said, I'd rather go with a function like crush's...
try this
var data = window.location.hash;
var d1 = Array();
d1 = data.split("&")
var myFilteredData = Array();
for( var i=0;i<d1.length;i++ )
{
var d2 = d1[i].split("=");
myFilteredData.push(d2[1]); //Taking String after '='
}
I hope it helps you.

Javascript string manipulation url

My problem is I am trying to extract certain things from the url. I am currently using
window.location.href.substr()
to grab something like "/localhost:123/list/chart=2/view=1"
What i have now, is using the index positioning to grab the chart and view value.
var chart = window.location.href.substr(-8);
var view = window.location.href.substr(-1);
But the problem comes in with I have 10 or more charts. The positioning is messed up. Is there a way where you can ask the code to get the string between "chart=" and the closest "/"?
var str = "/localhost:123/list/chart=2/view=1";
var data = str.match(/\/chart=([0-9]+)\/view=([0-9]+)/);
var chart = data[1];
var view = data[2];
Of course you may want to add in some validation checks before using the outcome of the match.
Inspired by Paul S. I have written a function version of my answer:
function getPathVal(name)
{
var path = window.location.pathname;
var regx = new RegExp('(?:/|&|\\?)'+name+'='+'([^/&,]+)');
var data = path.match(regx);
return data[1] || null;
}
getPathVal('chart');//2
Function should work for fetching params from standard get parameter syntax in a URI, or the syntax in your example URI
Here's a way using String.prototype.indexOf
function getPathVar(key) {
var str = window.location.pathname,
i = str.indexOf('/' + key + '=') + key.length + 2,
j = str.indexOf('/', i);
if (i === key.length + 1) return '';
return str.slice(i, j);
}
// assuming current path as described in question
getPathVar('chart');
You could split your string up, with "/" as delimiter and then loop through the resulting array to find the desired parameters. That way you can easily extract all parameters automatically:
var x = "/localhost:123/list/chart=2/view=1";
var res = {};
var spl = x.split("/");
for (var i = 0; i < spl.length; i++) {
var part = spl[i];
var index = part.indexOf("=");
if (index > 0) {
res[part.substring(0, index)] = part.substring(index + 1);
}
}
console.log(res);
// res = { chart: 2, view: 1}
FIDDLE

Want to get set value in javascript issue

I want my code to display 170, 122 . All the values have been set in Javascript but still I am not getting the output.
<!DOCTYPE html>
<html>
<body>
<button onclick="UidToPost()">Get It</button>
<script>
var SetUid1 = "170";
var SetUid2 = "122";
var SetUid3 = "135";
var SetUid4 = "144";
var c = 0;
var timingToSend;
var SetUid;
function UidToPost() {
c = c + 1;
var postTo = "SetUid" + c + "";
document.getElementById("do").innerHTML = postTo;
timingToSend = setTimeout('UidToPost()', 1000);
};
</script>
<p id="do"></p>
</body>
</html>
Thanks in advance.
This is the code that I am using
var SetUid = [ "170", "122", "135", "144" ];
var c = 0;
var timingToSend;
function UidToPost() {
var postTo = SetUid[c++];
document.getElementById("do").innerHTML = postTo;
if (c < SetUid.length)
timingToSend = setTimeout(UidToPost, 1000);
};
Use an array instead of discreet variables;
var SetUid = [ "170", "122", "135", "144" ];
var c = 0;
var timingToSend;
function UidToPost() {
var postTo = SetUid[c++];
document.getElementById("do").innerHTML = postTo;
if (c < SetUid.length)
timingToSend = setTimeout(UidToPost, 1000);
};
You're trying to dynamically create the name of the variable to use with string concatenation, which is possible but not with that syntax. Since your variables are global variables, they'll be stored in the window object, so you can access them like this:
window["SetUid1"]
window["setUid2"]
//etc
With that in mind, you'll simply need to change this line:
var postTo = "SetUid" + c + "";
to:
var postTo = window["SetUid" + c];
You'll also need to handle the case where that variable doesn't exist (i.e. they click the button again after the last variable has been displayed), and take appropriate action (probably cycle back to the beginning).
Here is a working demo.
document.getElementById("do").innerHTML = window[postTo];
You should also get in the habit of avoiding the string argument version of setTimeout as it can cause security issues:
timingToSend = setTimeout(UidToPost, 1000);
I presume you'll also want to call clearTimeout() (or avoid setting the last one in the first place), e.g., after your variables are finished.
Finally, this might have been done more easily and flexibly with an array, but the above is how you can do it with your current approach.
This will do the trick:
document.getElementById("do").innerHTML = window[postTo];
You still have to perform a check for the number of vars. Now after the 4th var is displayed, the function will now write "undefined" to the screen because you keep looping.
The reason this is not working, is that you're concatenating the string SetUid with the current count c to make a string, and adding that to the innerHTML of the div.
Instead, you should hold your values in an array and use your variable c as an index to that array:
var values = [170,122,135,144]
var c = -1;
var timingToSend;
var SetUid;
function UidToPost() {
c = (c + 1) % values.length;
var postTo = "SetUid" + c + "";
document.getElementById("do").innerHTML = values[c];
timingToSend = setTimeout('UidToPost()', 1000);
}
Live example: http://jsfiddle.net/RsKZj/

JavaScript variable not is undefined in IE9

Hello I have next JS code (this code not my own)
function somename(f)
var procName = "";
var procParams = new Array();
var parseEl = "";
var parseEls = new Array();
var parseInd = 0;
var procParamsInd = 0;
var IsValRead = false;
for (i = 0; i < f.length; i++) {
if (f[i] == "(")
break;
else
procName = procName + f[i];
}
}
I will redo it to much better way to find data before "(", but i wounder why procName variable is always undefined in IE9 in all browsers all working well.
I have a vague recollection that at least some versions of IE do not support indexing to access string characters. Try using charAt instead; or a better algorithm. It is almost certainly the f[x] which is causing your undefined's.
A better way to get the substring before ( is this:
var f = "name(2,4,5)",
procName = f.slice(0, f.indexOf('(')); //slice from start until before "("
console.log(procName)​; //name

javascript - Get a portion of the cookie value with substr method

I have a cookie called "login" that contains a structure like "username|hashcode|salt".
Here's my code:
function readTheCookie(the_info)
{
var the_cookie = document.cookie;
var the_cookie = unescape(the_cookie);
var broken_cookie2 = the_cookie.substr(6);
alert(broken_cookie2);
}
readTheCookie('login');
I'ts giving me
pickup22|d47f45d141bf4ecc999ec4c083e28cf7|4ece9bce292e1
Now I just want the first part (everything before the first pipe , in that case, I want pickup22)
How can I do that? Cause the username will never be the same, so I cant put a "fixed" lenght.
Any help appreciated!
var readTheCookie = function (the_info) {
var the_cookie = document.cookie.split(";"), a = the_cookie.length, b;
for (b = 0; b < a; b += 1) {
if (the_cookie[b].substr(0, the_info.length) === the_info) {
return the_cookie.split("=")[1].split("|")[0];
}
}
if (b === a) {
return "";
}
},
username = readTheCookie('login');
That is nice and compact, plus easy to read, and finally it is JSLint compliant. Enjoy!
best way is to use split() method.
var parts = new Array();
parts = broken_cookie2.split("|");
var username = parts[0];
var hashcode = parts[1];
var salt = parts[2];

Categories