Wie erstelle ich Abfrageparameter in Javascript?

Gibt es eine Möglichkeit, die Abfrageparameter für eine GET-Anforderung in JavaScript zu erstellen ?

Genau wie in Python urllib.urlencode(), das ein Wörterbuch (oder eine Liste von zwei Tupeln) aufnimmt und eine Zeichenfolge wie erstellt 'var1=value1&var2=value2'.

Bitte schön:

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

Verwendung:

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

URLSearchParams unterstützt zunehmend Browser.

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

const searchParams = new URLSearchParams(data);

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

Node.js bietet das Querystring- Modul an.

const querystring = require('querystring');

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

const searchParams = querystring.stringify(data);

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

funktional

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

Zabba hat in einem Kommentar zur aktuell akzeptierten Antwort einen Vorschlag gemacht, der für mich die beste Lösung ist: Verwenden Sie jQuery.param () .

Wenn ich jQuery.param()die Daten in der ursprünglichen Frage verwende, lautet der Code einfach:

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

Die Variable paramswird sein

"var1=value&var2=value"

Kompliziertere Beispiele, Ein- und Ausgaben finden Sie in der Dokumentation zu jQuery.param () .

Wir haben gerade arg.js veröffentlicht , ein Projekt, das darauf abzielt, dieses Problem ein für alle Mal zu lösen. Es war traditionell so schwierig, aber jetzt können Sie Folgendes tun:

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

Und das Lesen funktioniert:

var name = Arg("name");

oder das ganze Los bekommen:

var params = Arg.all();

und wenn Sie sich für den Unterschied zwischen ?query=trueund interessieren #hash=true, können Sie die Methoden Arg.query()und Arg.hash()verwenden.

Dies sollte den Job machen:

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

Beispiel:

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

Ergebnis:

name=John&postcode=W1%202DL

ES2017 (ES8)

Verwenden von Object.entries(), wodurch ein Array von Objektpaaren zurückgegeben [key, value]wird. Zum Beispiel {a: 1, b: 2}würde es zurückkehren [['a', 1], ['b', 2]]. Es wird nicht nur vom IE unterstützt (und wird es auch nicht sein).

Code:

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

Beispiel:

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

Ergebnis:

"name=John&gender=male"

Wenn Sie Prototype verwenden, gibt es Form.serialize

Wenn Sie jQuery verwenden, gibt es Ajax / serialize

Ich kenne zwar keine unabhängigen Funktionen, um dies zu erreichen, aber eine Google-Suche hat einige vielversprechende Optionen ergeben, wenn Sie derzeit keine Bibliothek verwenden. Wenn Sie nicht sind, sollten Sie wirklich, weil sie der Himmel sind.

Ich möchte diese fast 10 Jahre alte Frage noch einmal aufgreifen. In dieser Ära der Standardprogrammierung ist es am besten, Ihr Projekt mit einem Abhängigkeitsmanager ( npm) einzurichten . Es gibt eine ganze Heimindustrie von Bibliotheken, die Abfragezeichenfolgen codieren und sich um alle Randfälle kümmern. Dies ist einer der beliebtesten -

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

Eine kleine Änderung am Typoskript:

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

Dieser Thread verweist auf Code zum Escapen von URLs in PHP. Es gibt escape()und unescape()welche werden den größten Teil der Arbeit erledigen, aber Sie müssen ein paar zusätzliche Dinge hinzufügen.

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