Come creare parametri di query in Javascript?

C’è un modo per creare i parametri di query per fare una richiesta GET in JavaScript?

Proprio come in Python hai urllib.urlencode() , che urllib.urlencode() un dizionario (o un elenco di due tuple) e crea una stringa come 'var1=value1&var2=value2' .

Ecco qui:

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

funzionale

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

Zabba ha fornito in un commento sulla risposta attualmente accettata un suggerimento che per me è la soluzione migliore: utilizzare jQuery.param () .

Se uso jQuery.param() sui dati nella domanda originale, il codice è semplicemente:

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

I params variabili saranno

 "var1=value&var2=value" 

Per esempi più complicati, input e output, consultare la documentazione di jQuery.param () .

Abbiamo appena rilasciato arg.js , un progetto finalizzato a risolvere questo problema una volta per tutte. Tradizionalmente è stato così difficile ma ora puoi fare:

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

E leggere i lavori:

 var name = Arg("name"); 

o ottenendo l’intero lotto:

 var params = Arg.all(); 

e se ti interessa la differenza tra ?query=true e #hash=true allora puoi usare i Arg.query() e Arg.hash() .

Se si utilizza Prototype, esiste Form.serialize

Se si utilizza jQuery, esiste Ajax / serialize

Non conosco alcuna funzione indipendente per realizzare questo, però, ma una ricerca su google ha mostrato alcune opzioni promettenti se non si sta attualmente utilizzando una libreria. Se non lo sei, però, dovresti davvero perché sono un paradiso.

Proprio come rivisitare questa domanda di quasi 10 anni. In questa era di programmazione npm , la soluzione migliore è impostare il progetto usando un manager delle dipendenze ( npm ). Lì fuori c’è un’intera industria di librerie che codifica le stringhe di query e si prende cura di tutti i casi limite. Questo è uno dei più popolari –

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

Una piccola modifica al typescript:

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

Questo dovrebbe fare il lavoro:

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

Esempio:

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

Risultato:

 name=John&postcode=W1%202DL 

ES2017 (ES8)

Facendo uso di Object.entries() , che restituisce una matrice di coppie [key, value] dell’object. Ad esempio, per {a: 1, b: 2} restituirà [['a', 1], ['b', 2]] . Non è supportato (e non sarà) solo da IE.

Codice:

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

Esempio:

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

Risultato:

 "name=John&gender=male" 

URLSearchParams ha un crescente supporto per i browser.

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

Questo thread punta ad un codice per l’escape degli URL in php. C’è escape() e unescape() che farà la maggior parte del lavoro, ma è necessario aggiungere un paio di cose in più.

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