web-dev-qa-db-fra.com

Comment lire les données GET d'une URL en utilisant JavaScript?

J'essaie de transmettre des données d'une page à une autre.

www.mints.com?name=chose chose

Comment lire name en utilisant JavaScript?

35
jbcedge
function parseURLParams(url) {
    var queryStart = url.indexOf("?") + 1,
        queryEnd   = url.indexOf("#") + 1 || url.length + 1,
        query = url.slice(queryStart, queryEnd - 1),
        pairs = query.replace(/\+/g, " ").split("&"),
        parms = {}, i, n, v, nv;

    if (query === url || query === "") return;

    for (i = 0; i < pairs.length; i++) {
        nv = pairs[i].split("=", 2);
        n = decodeURIComponent(nv[0]);
        v = decodeURIComponent(nv[1]);

        if (!parms.hasOwnProperty(n)) parms[n] = [];
        parms[n].Push(nv.length === 2 ? v : null);
    }
    return parms;
}

Utilisez comme suit:

var urlString = "http://www.foo.com/bar?a=a+a&b%20b=b&c=1&c=2&d#hash";
    urlParams = parseURLParams(urlString);

qui retourne un objet comme ceci: 

{
  "a"  : ["a a"],     /* param values are always returned as arrays */
  "b b": ["b"],       /* param names can have special chars as well */
  "c"  : ["1", "2"]   /* an URL param can occur multiple times!     */
  "d"  : [null]       /* parameters without values are set to null  */ 
} 

Alors

parseURLParams("www.mints.com?name=something")

donne

{name: ["something"]}

EDIT: La version originale de cette réponse utilisait une approche basée sur les expressions régulières pour l'analyse des URL. Il utilisait une fonction plus courte, mais l'approche était défectueuse et je l'ai remplacée par un analyseur approprié.

53
Tomalak

Je pense que cela devrait aussi fonctionner:

function $_GET(q,s) {
    s = (s) ? s : window.location.search;
    var re = new RegExp('&amp;'+q+'=([^&amp;]*)','i');
    return (s=s.replace(/^\?/,'&amp;').match(re)) ?s=s[1] :s='';
}

Appelez ça comme ça:

var value = $_GET('myvariable');
6
Steven

location.search https://developer.mozilla.org/en/DOM/window.location

bien que la plupart utilisent une sorte de routine d'analyse pour lire les paramètres de chaîne de requête.

voici un http://safalra.com/web-design/javascript/parsing-query-strings/

3
Chad Grant

Voici une solution. Bien sûr, cette fonction n’a pas besoin de se charger dans une option "window.params" - qui peut être personnalisée. 

window.params = function(){
    var params = {};
    var param_array = window.location.href.split('?')[1].split('&');
    for(var i in param_array){
        x = param_array[i].split('=');
        params[x[0]] = x[1];
    }
    return params;
}();

Exemple d'appel d'API sur http://www.mints.com/myurl.html?name=something&goal=true :

if(window.params.name == 'something') doStuff();
else if( window.params.goal == 'true') shoutGOOOOOAAALLL();
3
drostie

La réponse actuellement choisie ne fonctionnait pas du tout dans mon cas, ce qui me semble assez typique. J'ai trouvé la fonction ci-dessous ici et cela fonctionne très bien!

function getAllUrlParams(url) {

  // get query string from url (optional) or window
  var queryString = url ? url.split('?')[1] : window.location.search.slice(1);

  // we'll store the parameters here
  var obj = {};

  // if query string exists
  if (queryString) {

    // stuff after # is not part of query string, so get rid of it
    queryString = queryString.split('#')[0];

    // split our query string into its component parts
    var arr = queryString.split('&');

    for (var i=0; i<arr.length; i++) {
      // separate the keys and the values
      var a = arr[i].split('=');

      // in case params look like: list[]=thing1&list[]=thing2
      var paramNum = undefined;
      var paramName = a[0].replace(/\[\d*\]/, function(v) {
        paramNum = v.slice(1,-1);
        return '';
      });

      // set parameter value (use 'true' if empty)
      var paramValue = typeof(a[1])==='undefined' ? true : a[1];

      // (optional) keep case consistent
      paramName = paramName.toLowerCase();
      paramValue = paramValue.toLowerCase();

      // if parameter name already exists
      if (obj[paramName]) {
        // convert value to array (if still string)
        if (typeof obj[paramName] === 'string') {
          obj[paramName] = [obj[paramName]];
        }
        // if no array index number specified...
        if (typeof paramNum === 'undefined') {
          // put the value on the end of the array
          obj[paramName].Push(paramValue);
        }
        // if array index number specified...
        else {
          // put the value at that index number
          obj[paramName][paramNum] = paramValue;
        }
      }
      // if param name doesn't exist yet, set it
      else {
        obj[paramName] = paramValue;
      }
    }
  }

  return obj;
}
1
plaidcorp

Iv'e a corrigé/amélioré la réponse de Tomalak avec:

  • Faire un tableau que si nécessaire.
  • S'il y a un autre symbole d'équation dans la valeur, il se trouve à l'intérieur de la valeur
  • Il utilise maintenant la valeur location.search au lieu d'une URL.
  • Une chaîne de recherche vide donne un objet vide.

Code:

function getSearchObject() {
    if (location.search === "") return {};

    var o = {},
        nvPairs = location.search.substr(1).replace(/\+/g, " ").split("&");

    nvPairs.forEach( function (pair) {
        var e = pair.indexOf('=');
        var n = decodeURIComponent(e < 0 ? pair : pair.substr(0,e)),
            v = (e < 0 || e + 1 == pair.length) 
                ? null : 
                decodeURIComponent(pair.substr(e + 1,pair.length - e));
        if (!(n in o))
            o[n] = v;
        else if (o[n] instanceof Array)
            o[n].Push(v);
        else
            o[n] = [o[n] , v];
    });
    return o;
}
1
EliSherer

J'ai aussi créé une fonction assez simple . Vous y appelez par: Get ("yourgetname");

et récupérez tout ce qu'il y avait… .. (maintenant que je l'ai écrit, j'ai remarqué qu'il vous donnerait 26% si vous aviez un & dans votre valeur ..)

function get(name){
  var url = window.location.search;
  var num = url.search(name);
  var namel = name.length;
  var frontlength = namel+num+1; //length of everything before the value 
  var front = url.substring(0, frontlength);  
  url = url.replace(front, "");  
  num = url.search("&");

 if(num>=0) return url.substr(0,num); 
 if(num<0)  return url;             
}
0
Peter Wegrzyn