Como criar parâmetros de consulta em JavaScript?

Existe alguma maneira de criar os parâmetros de consulta para fazer uma solicitação GET em JavaScript?

Assim como em Python você tem urllib.urlencode() , que recebe um dictionary (ou lista de duas tuplas) e cria uma string como 'var1=value1&var2=value2' .

Aqui está:

 function encodeQueryData(data) { let ret = []; for (let d in data) ret.push(encodeURIComponent(d) + '=' + encodeURIComponent(data[d])); return ret.join('&'); } 

Uso:

 var data = { 'first name': 'George', 'last name': 'Jetson', 'age': 110 }; var querystring = encodeQueryData(data); 

funcional

 function encodeData(data) { return Object.keys(data).map(function(key) { return [key, data[key]].map(encodeURIComponent).join("="); }).join("&"); } 

Zabba forneceu em um comentário sobre a resposta aceita uma sugestão de que para mim é a melhor solução: use jQuery.param () .

Se eu usar jQuery.param() nos dados da pergunta original, o código é simplesmente:

 var params = jQuery.param({ var1: 'value', var2: 'value' }); 

A variável params será

 "var1=value&var2=value" 

Para exemplos mais complicados, inputs e saídas, consulte a documentação do jQuery.param () .

Acabamos de lançar o arg.js , um projeto que visa resolver esse problema de uma vez por todas. É tradicionalmente tão difícil, mas agora você pode fazer:

 var querystring = Arg.url({name: "Mat", state: "CO"}); 

E lendo trabalhos:

 var name = Arg("name"); 

ou recebendo todo o lote:

 var params = Arg.all(); 

e se você se importa com a diferença entre ?query=true e #hash=true então você pode usar os Arg.query() e Arg.hash() .

Se você estiver usando Prototype há Form.serialize

Se você estiver usando jQuery, há Ajax / serializar

Eu não sei de nenhuma function independente para fazer isso, mas uma pesquisa no google por ela encontrou algumas opções promissoras se você não está usando uma biblioteca no momento. Se você não é, você deveria, porque eles são o paraíso.

Apenas gostaria de rever esta questão de quase 10 anos. Nesta era de programação pronta, sua melhor aposta é configurar seu projeto usando um gerenciador de dependencies ( npm ). Existe uma indústria caseira de bibliotecas que codificam cadeias de consulta e cuidam de todos os casos de borda. Este é um dos mais populares –

https://www.npmjs.com/package/query-string

Uma pequena modificação no texto datilografado:

  public encodeData(data: any): string { return Object.keys(data).map((key) => { return [key, data[key]].map(encodeURIComponent).join("="); }).join("&"); } 

Isso deve fazer o trabalho:

 const createQueryParams = params => Object.keys(params) .map(k => `${k}=${encodeURI(params[k])}`) .join('&'); 

Exemplo:

 const params = { name : 'John', postcode: 'W1 2DL'} const queryParams = createQueryParams(params) 

Resultado:

 name=John&postcode=W1%202DL 

ES2017 (ES8)

Fazendo uso de Object.entries() , que retorna uma matriz dos pares [key, value] do object. Por exemplo, para {a: 1, b: 2} retornaria [['a', 1], ['b', 2]] . Não é suportado (e não será) apenas pelo IE.

Código:

 const buildURLQuery = obj => Object.entries(obj) .map(pair => pair.map(encodeURIComponent).join('=')) .join('&'); 

Exemplo:

 buildURLQuery({name: 'John', gender: 'male'}); 

Resultado:

 "name=John&gender=male" 

URLSearchParams tem suporte crescente para navegadores.

 const data = { var1: 'value1', var2: 'value2' }; const searchParams = new URLSearchParams(data); // searchParams.toString() === 'var1=value1&var2=value2' 

Este segmento aponta para algum código para escaping de URLs no php. Há escape() e unescape() que fará a maior parte do trabalho, mas você precisa adicionar algumas coisas extras.

 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; }