Apakah ada pustaka JavaScript yang membuat kamus dari string kueri, ASP.NETgaya?

Sesuatu yang bisa digunakan seperti:

var query = window.location.querystring["query"]?

Apakah "string kueri" disebut sebagai sesuatu yang lain di luar .NETdunia? Mengapa tidak location.searchdipecah menjadi koleksi kunci / nilai ?

EDIT : Saya telah menulis fungsi saya sendiri, tetapi apakah ada pustaka JavaScript utama yang melakukan ini?

Mungkin http://plugins.jquery.com/query-object/ ?

Ini adalah percabangannya https://github.com/sousk/jquery.parsequery#readme .

Anda dapat mengekstrak pasangan kunci / nilai dari properti location.search , properti ini memiliki bagian dari URL yang mengikuti? simbol, termasuk? simbol.

function getQueryString() {
  var result = {}, queryString = location.search.slice(1),
      re = /([^&=]+)=([^&]*)/g, m;

  while (m = re.exec(queryString)) {
    result[decodeURIComponent(m[1])] = decodeURIComponent(m[2]);
  }

  return result;
}

// ...
var myParam = getQueryString()["myParam"];

tl; dr solusi pada satu baris (ish) kode menggunakan vanilla javascript

var queryDict = {}
location.search.substr(1).split("&").forEach(function(item) {
    queryDict[item.split("=")[0]] = item.split("=")[1]
})

Untuk querystring, ?a=1&b=2&c=3&d&eia mengembalikan:

> queryDict
a: "1"
b: "2"
c: "3"
d: undefined
e: undefined

kunci multi-nilai dan karakter yang disandikan ?

Lihat jawaban asli di Bagaimana saya bisa mendapatkan nilai string kueri di JavaScript?

"?a=1&b=2&c=3&d&e&a=5&a=t%20e%20x%20t&e=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dståle%26car%3Dsaab"
> queryDict
a: ["1", "5", "t e x t"]
b: ["2"]
c: ["3"]
d: [undefined]
e: [undefined, "http://w3schools.com/my test.asp?name=ståle&car=saab"]

Setelah menemukan posting ini, ketika melihat diri saya sendiri, saya pikir saya harus menambahkan bahwa menurut saya solusi yang paling banyak dipilih adalah yang terbaik. Itu tidak menangani nilai array (seperti? A = foo & a = bar - dalam hal ini saya berharap mendapatkan untuk mengembalikan ['foo', 'bar']). Ini juga sejauh yang saya tahu tidak memperhitungkan nilai yang dikodekan - seperti pengkodean karakter hex di mana% 20 mewakili spasi (contoh:? A = Hello% 20World) atau simbol plus yang digunakan untuk mewakili spasi (contoh :? a = Halo + Dunia).

Node.js menawarkan apa yang tampak seperti solusi yang sangat lengkap untuk penguraian querystring. Ini akan mudah untuk diambil dan digunakan dalam proyek Anda sendiri karena cukup terisolasi dengan baik dan di bawah lisensi yang permisif.

Kode untuk itu dapat dilihat di sini: https://github.com/joyent/node/blob/master/lib/querystring.js

Tes yang dimiliki Node dapat dilihat di sini: https://github.com/joyent/node/blob/master/test/simple/test-querystring.js Saya sarankan mencoba beberapa di antaranya dengan jawaban populer untuk melihat bagaimana itu menangani mereka.

Ada juga proyek yang saya libatkan untuk secara khusus menambahkan fungsi ini. Ini adalah port dari modul parsing string kueri lib standar Python. Garpu saya dapat ditemukan di sini: https://github.com/d0ugal/jquery.qeeree

Atau Anda bisa menggunakan pustaka sugar.js .

Dari sugarjs.com:

Object.fromQueryString (str , deep = true )

Mengonversi string kueri dari URL menjadi objek. Jika deep salah, konversi hanya akan menerima parameter dangkal (yaitu, tidak ada objek atau array dengan sintaks []) karena ini tidak didukung secara universal.

Object.fromQueryString('foo=bar&broken=wear') >{"foo":"bar","broken":"wear"}
Object.fromQueryString('foo[]=1&foo[]=2') >{"foo":[1,2]}

Contoh:

var queryString = Object.fromQueryString(location.search);
var foo = queryString.foo;

Jika Anda memiliki querystring, gunakan ini:

 /**
 * @param qry the querystring
 * @param name name of parameter
 * @returns the parameter specified by name
 * @author [email protected]
 */

function getQueryStringParameter(qry,name){
    if(typeof qry !== undefined && qry !== ""){
        var keyValueArray = qry.split("&");
        for ( var i = 0; i < keyValueArray.length; i++) {
            if(keyValueArray[i].indexOf(name)>-1){
                return keyValueArray[i].split("=")[1];
            }
        }
    }
    return "";
}

// How about this
function queryString(qs) {
    var queryStr = qs.substr(1).split("&"),obj={};
    for(var i=0; i < queryStr.length;i++)
        obj[queryStr[i].split("=")[0]] = queryStr[i].split("=")[1];
    return obj;
}

// Usage:
var result = queryString(location.search);

Perlu dicatat, pustaka yang disebutkan John Slegers memang memiliki ketergantungan jQuery, namun di sini ada versi yang merupakan vanilla Javascript.

https://github.com/EldonMcGuinness/querystring.js

Saya hanya akan mengomentari postingannya, tetapi saya kurang memiliki reputasi untuk melakukannya. : /

Contoh:

Contoh di bawah ini memproses string kueri berikut, meskipun tidak teratur:

?foo=bar&foo=boo&roo=bar;bee=bop;=ghost;=ghost2;&;checkbox%5B%5D=b1;checkbox%5B%5D=b2;dd=;http=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab&http=http%3A%2F%2Fw3schools2.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab 

var qs = "?foo=bar&foo=boo&roo=bar;bee=bop;=ghost;=ghost2;&;checkbox%5B%5D=b1;checkbox%5B%5D=b2;dd=;http=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab&http=http%3A%2F%2Fw3schools2.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab";
//var qs = "?=&=";
//var qs = ""

var results = querystring(qs);

(document.getElementById("results")).innerHTML =JSON.stringify(results, null, 2);

<script 
src="https://rawgit.com/EldonMcGuinness/querystring.js/master/dist/querystring.min.js"></script>
<pre id="results">RESULTS: Waiting...</pre>

Kode

Ini Intinya oleh Eldon McGuinness ini sejauh ini merupakan implementasi paling lengkap dari parser string kueri JavaScript yang pernah saya lihat sejauh ini.

Sayangnya, ini ditulis sebagai plugin jQuery.

Saya menulis ulang ke vanilla JS dan membuat beberapa perbaikan:

function parseQuery(str) {
  var qso = {};
  var qs = (str || document.location.search);
  // Check for an empty querystring
  if (qs == "") {
    return qso;
  }
  // Normalize the querystring
  qs = qs.replace(/(^\?)/, '').replace(/;/g, '&');
  while (qs.indexOf("&&") != -1) {
    qs = qs.replace(/&&/g, '&');
  }
  qs = qs.replace(/([\&]+$)/, '');
  // Break the querystring into parts
  qs = qs.split("&");
  // Build the querystring object
  for (var i = 0; i < qs.length; i++) {
    var qi = qs[i].split("=");
    qi = qi.map(function(n) {
      return decodeURIComponent(n)
    });
    if (typeof qi[1] === "undefined") {
      qi[1] = null;
    }
    if (typeof qso[qi[0]] !== "undefined") {

      // If a key already exists then make this an object
      if (typeof (qso[qi[0]]) == "string") {
        var temp = qso[qi[0]];
        if (qi[1] == "") {
          qi[1] = null;
        }
        qso[qi[0]] = [];
        qso[qi[0]].push(temp);
        qso[qi[0]].push(qi[1]);

      } else if (typeof (qso[qi[0]]) == "object") {
        if (qi[1] == "") {
          qi[1] = null;
        }
        qso[qi[0]].push(qi[1]);
      }
    } else {
      // If no key exists just set it as a string
      if (qi[1] == "") {
        qi[1] = null;
      }
      qso[qi[0]] = qi[1];
    }
  }
  return qso;
}

Bagaimana cara menggunakannya

var results = parseQuery("?foo=bar&foo=boo&roo=bar;bee=bop;=ghost;=ghost2;&;checkbox%5B%5D=b1;checkbox%5B%5D=b2;dd=;http=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab&http=http%3A%2F%2Fw3schools2.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab");

Keluaran

{
  "foo": ["bar", "boo" ],
  "roo": "bar",
  "bee": "bop",
  "": ["ghost", "ghost2"],
  "checkbox[]": ["b1", "b2"],
  "dd": null,
  "http": [
    "http://w3schools.com/my test.asp?name=ståle&car=saab",
    "http://w3schools2.com/my test.asp?name=ståle&car=saab"
  ]
}

Lihat juga Biola ini .

function decode(s) {
    try {
        return decodeURIComponent(s).replace(/\r\n|\r|\n/g, "\r\n");
    } catch (e) {
        return "";
    }
}
function getQueryString(win) {
    var qs = win.location.search;
    var multimap = {};
    if (qs.length > 1) {
        qs = qs.substr(1);
        qs.replace(/([^=&]+)=([^&]*)/g, function(match, hfname, hfvalue) {
            var name = decode(hfname);
            var value = decode(hfvalue);
            if (name.length > 0) {
                if (!multimap.hasOwnProperty(name)) {
                    multimap[name] = [];
                }
                multimap[name].push(value);
            }
        });
    }
    return multimap;
}
var keys = getQueryString(window);
for (var i in keys) {
    if (keys.hasOwnProperty(i)) {
        for (var z = 0; z < keys[i].length; ++z) {
            alert(i + ":" + keys[i][z]);
        }
    }
}

Saya suka membuatnya tetap sederhana, mudah dibaca, dan kecil.

function searchToObject(search) {
    var pairs = search.substring(1).split("&"),
        obj = {}, pair;

    for (var i in pairs) {
        if (pairs[i] === "") continue;
        pair = pairs[i].split("=");
        obj[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1]);
    }
    return obj;
}

searchToObject(location.search);

Contoh:

searchToObject('?query=myvalue')['query']; // spits out: 'myvalue'

Fungsi Saya menulis untuk persyaratan yang mirip dengan ini dengan manipulasi string javascript murni

"http://www.google.lk/?Name=John&Age=20&Gender=Male"

function queryize(sampleurl){
    var tokens = url.split('?')[1].split('&');
    var result = {};

    for(var i=0; i<tokens.length; i++){
        result[tokens[i].split('=')[0]] = tokens[i].split('=')[1];
    }

    return result;
}

Pemakaian:

queryize(window.location.href)['Name'] //returns John
queryize(window.location.href)['Age'] //returns 20
queryize(window.location.href)['Gender'] //returns Male

Jika Anda menggunakan lodash + ES6, berikut adalah solusi satu baris: _.object(window.location.search.replace(/(^\?)/, '').split('&').map(keyVal => keyVal.split('=')));

Oke, karena semua orang mengabaikan pertanyaan saya yang sebenarnya, heh, saya juga akan memposting pertanyaan saya! Inilah yang saya miliki:

location.querystring = (function() {

    // The return is a collection of key/value pairs

    var queryStringDictionary = {};

    // Gets the query string, starts with '?'

    var querystring = unescape(location.search);

    // document.location.search is empty if no query string

    if (!querystring) {
        return {};
    }

    // Remove the '?' via substring(1)

    querystring = querystring.substring(1);

    // '&' seperates key/value pairs

    var pairs = querystring.split("&");

    // Load the key/values of the return collection

    for (var i = 0; i < pairs.length; i++) {
        var keyValuePair = pairs[i].split("=");
        queryStringDictionary[keyValuePair[0]] = keyValuePair[1];
    }

    // Return the key/value pairs concatenated

    queryStringDictionary.toString = function() {

        if (queryStringDictionary.length == 0) {
            return "";
        }

        var toString = "?";

        for (var key in queryStringDictionary) {
            toString += key + "=" + queryStringDictionary[key];
        }

        return toString;
    };

    // Return the key/value dictionary

    return queryStringDictionary;
})();

Dan tesnya:

alert(window.location.querystring.toString());

for (var key in location.querystring) {
    alert(key + "=" + location.querystring[key]);
}

Pikiran Anda berpikir, JavaScript bukanlah bahasa ibu saya.

Bagaimanapun, saya sedang mencari pustaka JavaScript (mis. JQuery, Prototype) yang sudah memiliki satu tulisan. :)

Membangun jawaban oleh @CMS Saya memiliki yang berikut (dalam CoffeeScript yang dapat dengan mudah diubah ke JavaScript):

String::to_query = ->
  [result, re, d] = [{}, /([^&=]+)=([^&]*)/g, decodeURIComponent]
  while match = re.exec(if @.match /^\?/ then @.substring(1) else @)
    result[d(match[1])] = d match[2] 
  result

Anda dapat dengan mudah mengambil apa yang Anda butuhkan dengan:

location.search.to_query()['my_param']

Kemenangan di sini adalah antarmuka berorientasi objek (bukan fungsional) dan dapat dilakukan pada string apa pun (bukan hanya pencarian lokasi).

Jika Anda sudah menggunakan pustaka JavaScript, fungsi ini sudah ada. Misalnya di sini adalah versi Prototipe