Bagaimana cara membuat parameter kueri dalam Javascript?

Apakah ada cara untuk membuat parameter kueri untuk melakukan permintaan GET dalam JavaScript?

Sama seperti di Python yang Anda miliki urllib.urlencode(), yang menggunakan kamus (atau daftar dua tupel) dan membuat string seperti 'var1=value1&var2=value2'.

Ini dia:

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

Pemakaian:

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

URLSearchParams telah meningkatkan dukungan browser.

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

const searchParams = new URLSearchParams(data);

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

Node.js menawarkan modul querystring .

const querystring = require('querystring');

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

const searchParams = querystring.stringify(data);

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

fungsional

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

Zabba telah memberikan komentar tentang jawaban yang saat ini diterima sebagai saran bahwa bagi saya adalah solusi terbaik: gunakan jQuery.param () .

Jika saya menggunakan jQuery.param()data dalam pertanyaan awal, maka kodenya adalah:

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

Variabelnya paramsadalah

"var1=value&var2=value"

Untuk contoh yang lebih rumit, input dan output, lihat dokumentasi jQuery.param () .

Kami baru saja merilis arg.js , sebuah proyek yang ditujukan untuk menyelesaikan masalah ini untuk selamanya. Secara tradisional sudah sangat sulit tetapi sekarang Anda dapat melakukannya:

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

Dan membaca bekerja:

var name = Arg("name");

atau mendapatkan semuanya:

var params = Arg.all();

dan jika Anda peduli tentang perbedaan antara ?query=truedan #hash=truekemudian Anda dapat menggunakan Arg.query()dan Arg.hash()metode.

Ini harus melakukan pekerjaan:

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

Contoh:

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

Hasil:

name=John&postcode=W1%202DL

ES2017 (ES8)

Memanfaatkan Object.entries(), yang mengembalikan array [key, value]pasangan objek. Misalnya, untuk {a: 1, b: 2}itu akan kembali [['a', 1], ['b', 2]]. Itu tidak didukung (dan tidak akan) hanya oleh IE.

Kode:

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

Contoh:

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

Hasil:

"name=John&gender=male"

Jika Anda menggunakan Prototipe ada Form.serialize

Jika Anda menggunakan jQuery ada Ajax / serialize

Saya tidak tahu ada fungsi independen untuk melakukan ini, tetapi, pencarian google untuk itu muncul beberapa opsi yang menjanjikan jika Anda saat ini tidak menggunakan perpustakaan. Jika Anda tidak, Anda harus melakukannya karena itu surga.

Hanya ingin meninjau kembali pertanyaan berusia hampir 10 tahun ini. Di era pemrograman di luar rak, taruhan terbaik Anda adalah mengatur proyek Anda menggunakan dependency manager ( npm). Ada seluruh industri rumahan perpustakaan di luar sana yang menyandikan string kueri dan menangani semua kasus tepi. Ini adalah salah satu yang lebih populer -

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

Sedikit modifikasi pada naskah:

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

Utas ini menunjuk ke beberapa kode untuk keluar dari URL di php. Ada escape()dan unescape()yang akan melakukan sebagian besar pekerjaan, tetapi Anda perlu menambahkan beberapa hal tambahan.

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