How to create query parameters in Javascript

Question

Is there any way to create the query parameters for doing a GET request in JavaScript   Just like in Python you have urllib urlencode    which takes in a dictionary  or list of two tuples  and creates a string like  var1 value1 amp var2 value2

User · Answer

URLSearchParams has increasing browser support.

const data = {
  var1: 'value1',
  var2: 'value2'
};

const searchParams = new URLSearchParams(data);

// searchParams.toString() === 'var1=value1&var2=value2'

Node.js offers the querystring module.

const querystring = require('querystring');

const data = {
  var1: 'value1',
  var2: 'value2'
};

const searchParams = querystring.stringify(data);

// searchParams === 'var1=value1&var2=value2'

User · Answer

functional  function encodeData data        return Object keys data  map function key            return  key  data key   map encodeURIComponent  join              join   amp

User · Answer

Just like to revisit this almost 10 year old question  In this era of off-the-shelf programming  your best bet is to set your project up using a dependency manager  npm   There is an entire cottage industry of libraries out there that encode query strings and take care of all the edge cases  This is one of the more popular ones -  https   www npmjs com package query-string

User · Answer

This should do the job   const createQueryParams   params   gt         Object keys params               map k   gt     k    encodeURI params k                   join   amp       Example   const params     name    John   postcode   W1 2DL   const queryParams   createQueryParams params    Result    name John amp postcode W1 202DL

User · Answer

If you are using Prototype there is Form serialize  If you are using jQuery there is Ajax serialize  I do not know of any independent functions to accomplish this  though  but a google search for it turned up some promising options if you aren t currently using a library  If you re not  though  you really should because they are heaven

User · Answer

We ve just released arg js  a project aimed at solving this problem once and for all   It s traditionally been so difficult but now you can do   var querystring   Arg url  name   Mat   state   CO       And reading works   var name   Arg  name      or getting the whole lot   var params   Arg all      and if you care about the difference between  query true and  hash true then you can use the Arg query   and Arg hash   methods

User · Answer

I have improved the function of shog9 s to handle array values function encodeQueryData data        const ret           for  let d in data            if  typeof data d       object     typeof data d       array                 for  let arrD in data d                     ret push    encodeURIComponent d       encodeURIComponent data d  arrD                              else if  typeof data d       null     typeof data d       undefined                 ret push encodeURIComponent d             else               ret push    encodeURIComponent d     encodeURIComponent data d                           return ret join   amp         Example let data       user   Mark    fruits    apple    banana      encodeQueryData data     user Mark amp fruits   apple amp fruits   banana

User · Answer

ES2017  ES8   Making use of Object entries    which returns an array of object s  key  value  pairs  For example  for  a  1  b  2  it would return    a   1     b   2    It is not supported  and won t be  only by IE   Code   const buildURLQuery   obj   gt        Object entries obj               map pair   gt  pair map encodeURIComponent  join                    join   amp       Example   buildURLQuery  name   John   gender   male       Result    name John amp gender male

User · Answer

Zabba has provided in a comment on the currently accepted answer a suggestion that to me is the best solution  use jQuery param     If I use jQuery param   on the data in the original question  then the code is simply   const params   jQuery param       var1   value       var2   value        The variable params will be   var1 value amp var2 value    For more complicated examples  inputs and outputs  see the jQuery param   documentation

User · Answer

A little modification to typescript     public encodeData data  any   string       return Object keys data  map  key    gt          return  key  data key   map encodeURIComponent  join              join   amp

User · Answer

Here you go   function encodeQueryData data       const ret          for  let d in data       ret push encodeURIComponent d          encodeURIComponent data d        return ret join   amp         Usage   const data      first name    George    last name    Jetson    age   110    const querystring   encodeQueryData data

User · Answer

This thread points to some code for escaping URLs in php   There s escape   and unescape   which will do most of the work  but the you need add a couple extra things   function urlencode str    str   escape str   str   str replace        2B    str   str replace   20         str   str replace        2A    str   str replace        2F    str   str replace        40    return str     function urldecode str    str   str replace            str   unescape str   return str

[javascript] How to create query parameters in Javascript?

Examples related to javascript

Examples related to url

Examples related to urlencode