how to pass an object through url in javascript as a single var

Question

how to pass a js object through url

i have a js object

var info = {
    status: 1 ,
    time: "10:00:00-12:00:00" ,
    weekdays: {
      "monday",
      "tuesday"
    }
};

i don't want to use serialize, i want something like "localhost/jstest/#test?info"

Is there any way i can achieve this

will your object have second level?for example object{ p : "value" , p2 : value , p3 : {pi1 : value , pi2 : value} } — Behnam Esmaili
– Behnam Esmaili, Commented Jun 16, 2012 at 11:29
My question is a duplicate of this one. stackoverflow.com/questions/15399749/… — Anderson Green
– Anderson Green, Commented Mar 15, 2013 at 4:34

James Allardice · Accepted Answer · 2012-06-16 11:28:12Z

9

You are going to have to serialize it one way or another. You could do it in the way you suggest by storing a JSON string representing your object in e.g. sessionStorage, and passing the name of the key:

sessionStorage.setItem("info", JSON.stringify(info));
window.location("localhost/jstest/#test?info");

You can then access the data stored in that key:

var info = JSON.parse(sessionStorage.getItem("info"));

answered Jun 16, 2012 at 11:28

James Allardice

166k22 gold badges335 silver badges316 bronze badges

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

3 Comments

James Allardice Over a year ago

It won't work in IE below 8. But if you care about older browsers you could use a cookie instead, or use a web storage polyfill.

user1400191 Over a year ago

i will have to care about older browsers

James Allardice Over a year ago

Then use a cookie or the polyfill that I linked to.

Community · Accepted Answer · 2017-05-23 12:17:44Z

1

You can create your own querystring with the hashtag, then get the data from the url/hashtag in your code to retrieve the data.

like this:

localhost/jstest/#info!status=1!time=10:00:00-12:00:00!weekdays=monday,tuesday

Then you can find more help on how to read the hashtag data here: Working with single page websites and maintaining state using a URL hash and jQuery

edited May 23, 2017 at 12:17

CommunityBot

11 silver badge

answered Jun 16, 2012 at 11:29

Control Freak

13.2k31 gold badges101 silver badges150 bronze badges

Comments

msangel · Accepted Answer · 2021-04-25 02:13:43Z

1

This is my solution. Here you convert your object to JSON first, after making that string safe with base64 encoding for use in URL. Note this uses an additional plugin jquery.base64.js for working with base64. You can use your own library.

function packer(o){
    var str = JSON.stringify(a);
    var mess = $.base64.encode(str);
    return mess.replace(/\+/g,'-').replace(/\//g,'_').replace(/=/g,',');
}
function unpacker(str){
    var mess  = str.replace(/-/g,'+').replace(/_/g,'/').replace(/,/g,'=');
    mess = $.base64.decode(mess);
    return JSON.parse(mess);
}

answered Apr 25, 2021 at 2:13

msangel

10.5k3 gold badges58 silver badges73 bronze badges

1 Comment

dagalti Over a year ago

javascript version function packer(o){ var str = JSON.stringify(o); var mess = btoa(str); return mess.replace(/\+/g,'-').replace(/\//g,'_').replace(/=/g,','); } function unpacker(str){ var mess = str.replace(/-/g,'+').replace(/_/g,'/').replace(/,/g,'='); mess = atob(mess); return JSON.parse(mess); }

Collectives™ on Stack Overflow

how to pass an object through url in javascript as a single var

3 Answers 3

3 Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related