जावास्क्रिप्ट क्वेरी स्ट्रिंग [बंद]


106

क्या कोई जावास्क्रिप्ट लाइब्रेरी है जो क्वेरी स्ट्रिंग, ASP.NETशैली से एक शब्दकोश बनाती है ?

जो कुछ इस तरह इस्तेमाल किया जा सकता है:

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

क्या "क्वेरी स्ट्रिंग".NET दायरे के बाहर कुछ और कहा जाता है ? कुंजी / मान संग्रहlocation.search में क्यों नहीं तोड़ा गया है ?

संपादित करें : मैंने अपना स्वयं का कार्य लिखा है, लेकिन क्या कोई प्रमुख जावास्क्रिप्ट पुस्तकालय ऐसा करता है?


3
यह पाया: medialize.github.com/URI.js
deerchao



1
@davidtaubmann कि एक वृद्ध है, इसका उलटा होगा। मजेदार है कि वे अनिवार्य रूप से एक ही पूछते हैं, लेकिन प्रश्न के प्रारूप के कारण एक को समुदाय में महिमा मिल गई, और अन्य को ऑफ-टॉपिक के रूप में बंद कर दिया गया।
आंद्रे फिग्यूएरेडो

जवाबों:


11

शायद http://plugins.jquery.com/query-object/ ?

यह इसका कांटा है https://github.com/sousk/jquery.parfterery#readme


37
यह देशी होना चाहिए jquery
gcb

@EvanMulawski धन्यवाद। प्लग-इन बस गायब हो गया लगता है। मैंने एक अलग लिंक जोड़ा, जो मदद कर सकता है।
शैडो २५३१ ३०'११ बजे ०५

सीएमएस द्वारा प्रदान की गई विधि आसान और साफ है। Esp। यदि आप पहले से ही jquery का उपयोग नहीं कर रहे हैं।
jcoffland

1
आप इस लाइब्रेरी को ऐसा करने के लिए संदर्भित कर सकते हैं - github.com/Mikhus/jsurl
Mikhus

1
यहाँ उचित लिंक है: plugins.jquery.com/query-object
thexfactor

230

आप स्थान / खोज संपत्ति से कुंजी / मान जोड़े निकाल सकते हैं, इस संपत्ति में URL का हिस्सा है जो निम्नानुसार है? प्रतीक, सहित? प्रतीक।

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"];

11
यह कोई जीत नहीं है। यदि किसी कुंजी के मूल्य में '=' ​​वर्ण है तो क्या होगा? जैसे dork.com/?equation=10=2। आप तर्क दे सकते हैं कि यह URL से एनकोडेड होना चाहिए, लेकिन यह सुनिश्चित नहीं होना चाहिए। मैंने अपने आप से एक बार इस तरह एक भोली फ़ंक्शन लिखने की गलती की। इस फ़ंक्शन खाते के लिए एक से अधिक किनारे मामले हैं।
JamesBrownIsDead

6
@ जेम्स, यह उल्लेख करना भूल गए कि कुछ महीने पहले मैंने फ़ंक्शन को संशोधित किया है, अब यह आपके उदाहरण को सही ढंग से संभाल सकता है dork.com/?equation=10=2...
सीएमएस

2
@CMS यह क्वेरी स्ट्रिंग में किसी सरणी की संभावना को नहीं संभालता है जिसे इस प्रकार दर्शाया गया है कि ?val=foo&val=bar&val=baz आप इसे कैसे समझेंगे ?
रस ब्रैडबेरी

2
@RussBradberry आपके पास वास्तव में नहीं है val=foo&val=bar&val=baz; यह होना होगाval[]=foo&val[]=bar&val[]=baz
ब्रायन ड्रिस्कॉल

1
यह मुझे तब अधूरा लगा जब मेरे मूल्यों में रिक्त स्थान था और मेरे संस्करण समाप्त हो गए थे %20, इसलिए मैंने प्रतिस्थापित result[keyValuePair[0]] = keyValuePair[1] || '';कियाresult[keyValuePair[0]] = decodeURIComponent((keyValuePair[1]+'').replace(/\+/g, '%20')) || '';
user24601

22

वेनिला जावास्क्रिप्ट का उपयोग कर कोड की एक (ish) लाइन पर tl; ड्र का समाधान

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

क्वेरिस्ट्रिंग के लिए ?a=1&b=2&c=3&d&eयह रिटर्न:

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

बहु-मूल्यवान चाबियाँ और एन्कोड किए गए वर्ण ?

मूल उत्तर देखें कि मैं जावास्क्रिप्ट में क्वेरी स्ट्रिंग मान कैसे प्राप्त कर सकता हूं?

"?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"]

8
यह एक पंक्ति नहीं है - यह कई लाइनें बुरी तरह से स्वरूपित हैं!
जोनिरा

1
अरे, मैं नहीं जानता कि क्या कहना है ... तुम मुझे मिल गया। यहाँ, कुछ बहुस्तरीय समाधान है: `var queryDict = {}; स्थान। }); `
क्वर्टी

2
हाहा आई लव इट! क्षमा करें, मैं किसी ऐसे व्यक्ति के साथ काम करता था जो कहता था कि 'मुझे एक लाइनर मिल गया है जो x करता है' और फिर बस आपको 3 लाइनें दिखाई देती हैं, जिसमें से लाइन ब्रेक ली गई है!
जोनिरा

@JonnyLeeds कोई समस्या नहीं, मुझे पता है कि आपका क्या मतलब है, लेकिन फिर, क्यों हर एक नई लाइन पर जंजीर कमांड लिखेगा? फिर एक फ़ंक्शन दिया जाता है जो पैरामीटर (पैरामीटर आमतौर पर इनलेटेड होता है) जिसमें केवल एक ही असाइनमेंट होता है। यह चिल्लाया जा रहा है! : डी
क्वर्टी

1
@ क्वर्टी, यह शायद इसलिए है क्योंकि आपके "वन-लाइनर" को रिफॉर्मेट किया जाना चाहिए ताकि इसे पढ़ने के लिए क्षैतिज स्क्रॉलिंग की आवश्यकता न हो। मैंने इसे समायोजित कर लिया है।
पी आई

8

इस पोस्ट को खोजने के बाद, जब मैं खुद को देख रहा हूं तो मुझे लगा कि मुझे यह जोड़ना चाहिए कि मुझे नहीं लगता कि सबसे ज्यादा मतदान का समाधान सबसे अच्छा है। यह एरे वैल्यूज़ (जैसे कि = a = foo & a = bar - को हैंडल नहीं करता है) इस मामले में मुझे उम्मीद है कि मुझे ['फू', 'बार') वापस मिलेंगे। यह भी जहाँ तक मैं बता सकता हूँ कि इनकोडिंग मानों को ध्यान में नहीं रखा जाता है - जैसे कि हेक्स चरित्र एन्कोडिंग जहाँ% 20 एक स्थान का प्रतिनिधित्व करता है (उदाहरण:; a = हैलो% 20World) या प्लस चिन्ह का उपयोग किसी स्थान का प्रतिनिधित्व करने के लिए किया जा रहा है (उदाहरण :? a = हैलो + वर्ल्ड)।

Node.js प्रदान करता है कि पार्सिंग को शांत करने के लिए एक बहुत ही संपूर्ण समाधान कैसा दिखता है। अपनी स्वयं की परियोजना में इसे बाहर निकालना और उपयोग करना काफी आसान होगा क्योंकि यह काफी अच्छी तरह से अलग-थलग है और एक अनुज्ञेय लाइसेंस के तहत है।

इसके लिए कोड यहाँ देखा जा सकता है: https://github.com/joyent/node/blob/master/lib/querystring.js

नोड को जिन परीक्षणों को यहाँ देखा जा सकता है: https://github.com/joyent/node/blob/master/test/simple/test-querystring.js मैं उनमें से कुछ को लोकप्रिय उत्तर के साथ आज़माने का सुझाव दूंगा कि यह कैसे होता है उन्हें संभालता है।

एक परियोजना भी है जिसे मैं विशेष रूप से इस कार्यक्षमता को जोड़ने के लिए शामिल था। यह पायथन मानक के लिबास स्ट्रिंग स्ट्रिंग पार्सिंग मॉड्यूल का एक बंदरगाह है। मेरा कांटा यहाँ पाया जा सकता है: https://github.com/d0ugal/jquery.qeeree


कोड को केवल नोड से नहीं उधार लेना है, js, यह अत्यधिक परस्पर जुड़ा हुआ है।
अल्फवाट

5

या आप पुस्तकालय sugar.js का उपयोग कर सकते हैं ।

Sugarjs.com से:

Object.fromQueryString (str , deep = true )

URL के क्वेरी स्ट्रिंग को किसी ऑब्जेक्ट में परिवर्तित करता है। यदि गहरी झूठी है, तो रूपांतरण केवल उथले परिमों को स्वीकार करेगा (अर्थात। कोई वस्तु या सरणियाँ [] सिंटैक्स के साथ) नहीं, क्योंकि ये सार्वभौमिक रूप से समर्थित नहीं हैं।

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

उदाहरण:

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

3

यदि आपके पास हाथ पर क्वेरिस्ट्रिंग है, तो इसका उपयोग करें:

 /**
 * @param qry the querystring
 * @param name name of parameter
 * @returns the parameter specified by name
 * @author eduardo.medeirospereira@gmail.com
 */

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

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

वह "अपडेट: रिजेक्स का उपयोग करने की आवश्यकता नहीं है" कोड के ऊपर -अधिक-वोट किए गए उत्तर के समान है। इस प्रश्न में समान कोड का भार भी है )। आप decodeURIComponentकम से कम निकाले गए तारों को याद कर रहे हैं ।
रुप

@ रिप, इस उत्तर के बाद अद्यतन किया गया था।
क्वर्टी

@Qwerty नहीं यह नहीं था: अद्यतन फ़रवरी 2013 था, जबकि यह उत्तर लगभग एक वर्ष बाद फरवरी 2014 में था। लेकिन जो परवाह करता है, वहाँ समान कोड के बारे में बहुत कुछ है। decodeURIComponentहालांकि स्टैंड के बारे में मेरी टिप्पणी ।
रूप

@ रिप यूप, सॉरी। और हाँ।
क्वर्टी

2

यह ध्यान देने योग्य है, जॉन सैल्जर्स ने जिस लाइब्रेरी का उल्लेख किया है, उसमें एक jQuery निर्भरता है, हालांकि यहां एक संस्करण है जो वेनिला जावास्क्रिप्ट है।

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

मैंने बस उनकी पोस्ट पर टिप्पणी की होगी, लेकिन मुझे ऐसा करने के लिए प्रतिष्ठा की कमी है। : /

उदाहरण:

नीचे दिए गए उदाहरण निम्नलिखित प्रक्रिया है, यद्यपि अनियमित, क्वेरी स्ट्रिंग:

?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>


वास्तव में, मैंने अपने उत्तर में दिए गए कोड में jQuery की निर्भरता को दूर कर दिया ;-)
जॉन सेलर्स

2

कोड

एल्डन मैकगिनैनेस का यह जिस्म एक जावास्क्रिप्ट क्वेरी स्ट्रिंग पार्सर का अब तक का सबसे पूर्ण कार्यान्वयन है जिसे मैंने अब तक देखा है।

दुर्भाग्य से, यह एक jQuery प्लगइन के रूप में लिखा गया है।

मैंने इसे वेनिला JS में लिखा और कुछ सुधार किए:

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

इसे कैसे उपयोग करे

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

उत्पादन

{
  "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"
  ]
}

इस फिडल को भी देखें ।


1

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

यदि आप केस-असंवेदनशील होने के लिए hfname मिलान चाहते हैं तो आप .toLowerCase () नाम भी ले सकते हैं।
शैडो २५३१

आप यह देखने के लिए भी जांच कर सकते हैं कि मान खाली है या नहीं। यदि यह है, तो आप प्रविष्टि जोड़ना छोड़ सकते हैं ताकि सरणी में केवल गैर-रिक्त मान हों।
शैडो २५३१ १५'०

1
unescape () UTF-8 अनुक्रमों को नहीं संभालता है, इसलिए आप decodeURIComponent () का उपयोग करना चाह सकते हैं। हालाँकि, यदि आप चाहते हैं कि + रिक्त स्थान रिक्त हो जाए, तो रनिंग से पहले स्ट्रिंग पर .replace (/ \ + / g, "") चलाएं।
शैडो २५३१ १५'०

1

मैं इसे सरल, पठनीय और छोटा रखना पसंद करता हूं।

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

उदाहरण:

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

1

फंक्शन मैंने इसके लिए शुद्ध जावास्क्रिप्ट स्ट्रिंग हेरफेर के समान आवश्यकता के लिए लिखा था

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

उपयोग:

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

नीट, लेकिन इसके अलावा आप जिस तरह से अग्रणी को हटाते हैं वह ?मूल रूप से आपके ऊपर दो उत्तरों के समान है?
Rup

बस एक छोटा सा सुधार। जिस तरह से विधि का उपयोग किया जाता है वह उपयोगकर्ता के लिए आसान बनाता है। उपयोगकर्ता को केवल यह जानना होगा कि उसे किन क्वेरी स्ट्रिंग मान की आवश्यकता है।
प्रणव मारु

1

यदि आप लेश + ईएस 6 का उपयोग कर रहे हैं, तो यहां एक लाइन समाधान है: _.object(window.location.search.replace(/(^\?)/, '').split('&').map(keyVal => keyVal.split('=')));


0

ठीक है, क्योंकि हर कोई मेरे वास्तविक प्रश्न को नजरअंदाज कर रहा है, हे, मैं भी अपना पोस्ट करूँगा! यहाँ मेरे पास क्या है:

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

और परीक्षण:

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

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

आपके विचार से, जावास्क्रिप्ट मेरी मूल भाषा नहीं है।

वैसे भी, मैं एक जावास्क्रिप्ट पुस्तकालय (जैसे jQuery, प्रोटोटाइप) की तलाश कर रहा हूं जिसमें पहले से ही एक लिखा है। :)


1
मुझे यकीन नहीं है कि आपको वास्तव में कोड की तीन पंक्तियों के बराबर मात्रा में करने के लिए एक पुस्तकालय की आवश्यकता है! फिर भी, कम से कम आपको उम्मीद है कि एक पुस्तकालय को डिकोड्यूरिकम्पोनेंट () कुंजी और मूल्य दोनों याद होगा, अब तक पोस्ट किया गया हर कोड स्निपेट कुछ भी करने में विफल रहा है।
बोबिन्स

आप एक पुस्तकालय की जरूरत नहीं है। मैं एक पुस्तकालय में अपने कार्यान्वयन की तुलना करना चाहता था ताकि मैं देख सकूं कि क्या मैं किसी भी किनारे के मामलों को याद कर रहा हूं। :)
कोर

जावास्क्रिप्ट अपनी मूल भाषा में नहीं है इसका क्या मतलब है, आपको इसे सीखना चाहिए, भले ही आपको उपयोग करने के लिए एक पुस्तकालय की आवश्यकता हो
Marwan

0

@CMS के उत्तर पर बिल्डिंग मेरे पास निम्नलिखित है (कॉफीस्क्रिप्ट में जिसे आसानी से जावास्क्रिप्ट में बदला जा सकता है):

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

आप आसानी से क्या आप के साथ की जरूरत पकड़ कर सकते हैं:

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

यहां जीत एक ऑब्जेक्ट-ओरिएंटेड इंटरफ़ेस (कार्यात्मक के बजाय) है और यह किसी भी स्ट्रिंग पर किया जा सकता है (न केवल स्थान। खोज)।

यदि आप पहले से ही जावास्क्रिप्ट लाइब्रेरी का उपयोग कर रहे हैं तो यह फ़ंक्शन पहले से मौजूद है। उदाहरण के लिए यहाँ प्रोटोटाइप का संस्करण है

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.