Comment récupérer les paramètres GET en JavaScript

Question

Pensez-y :

http://example.com/page.html?returnurl=%2Fadmin

Pour js sur page.html comment peut-il récupérer GET paramètres ?

Pour l'exemple simple ci-dessus, func('returnurl') devrait être /admin .

Mais cela devrait également fonctionner pour les chaînes de requête complexes...

Answer 1

Avec le emplacement de la fenêtre objet. Ce code vous donne GET sans le point d'interrogation.

window.location.search.substr(1)

Dans votre exemple, il retournera returnurl=%2Fadmin

EDIT : J'ai pris la liberté de changer La réponse de Qwerty qui est vraiment bien et comme il l'a indiqué, j'ai suivi exactement ce que le PO demandait :

function findGetParameter(parameterName) {
    var result = null,
        tmp = [];
    location.search
        .substr(1)
        .split("&")
        .forEach(function (item) {
          tmp = item.split("=");
          if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
        });
    return result;
}

J'ai supprimé l'exécution de la fonction dupliquée de son code, en la remplaçant par une variable ( tmp ) et j'ai également ajouté decodeURIComponent exactement comme l'OP l'a demandé. Je ne suis pas sûr que cela puisse être ou non un problème de sécurité.

Ou sinon avec une simple boucle for, qui fonctionnera même dans IE8 :

function findGetParameter(parameterName) {
    var result = null,
        tmp = [];
    var items = location.search.substr(1).split("&");
    for (var index = 0; index < items.length; index++) {
        tmp = items[index].split("=");
        if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
    }
    return result;
}

Answer 2

window.location.search retournera tout à partir du ?. Le code ci-dessous enlèvera le ?, utilisera split pour séparer les tableaux clé/valeur, puis assignera les propriétés nommées à l'élément paramètres objet :

function getSearchParameters() {
    var prmstr = window.location.search.substr(1);
    return prmstr != null && prmstr != "" ? transformToAssocArray(prmstr) : {};
}

function transformToAssocArray( prmstr ) {
    var params = {};
    var prmarr = prmstr.split("&");
    for ( var i = 0; i < prmarr.length; i++) {
        var tmparr = prmarr[i].split("=");
        params[tmparr[0]] = tmparr[1];
    }
    return params;
}

var params = getSearchParameters();

Vous pouvez alors obtenir le test paramètre de http://myurl.com/?test=1 en appelant params.test .

Answer 3

tl;dr sur une seule ligne de code en utilisant le JavaScript classique.

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

C'est le la solution la plus simple . Il est malheureusement n'est pas gérer les clés à valeurs multiples et les caractères codés.

"?a=1&a=%2Fadmin&b=2&c=3&d&e"
> queryDict
a: "%2Fadmin"  // Overridden with the last value, not decoded.
b: "2"
c: "3"
d: undefined
e: undefined

Clés à valeurs multiples et caractères encodés ?

Voir la réponse originale à l'adresse suivante Comment puis-je obtenir les valeurs des chaînes de requête en 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&a=%2Fadmin"
> queryDict
a: ["1", "5", "t e x t", "/admin"]
b: ["2"]
c: ["3"]
d: [undefined]
e: [undefined, "http://w3schools.com/my test.asp?name=ståle&car=saab"]

---

Dans votre exemple, vous accédez à la valeur de la manière suivante :

"?returnurl=%2Fadmin"
> qd.returnurl    // ["/admin"]
> qd['returnurl'] // ["/admin"]
> qd.returnurl[0] // "/admin"

Answer 4

Une façon plus élégante de le faire : :)

var options = window.location.search.slice(1)
                      .split('&')
                      .reduce(function _reduce (/*Object*/ a, /*String*/ b) {
                        b = b.split('=');
                        a[b[0]] = decodeURIComponent(b[1]);
                        return a;
                      }, {});

Answer 5

Ma solution s'appuie sur celle de @tak3r.

Il renvoie un objet vide lorsqu'il n'y a pas de paramètres de requête et supporte la notation de tableau ?a=1&a=2&a=3 :

function getQueryParams () {
  function identity (e) { return e; }
  function toKeyValue (params, param) {
    var keyValue = param.split('=');
    var key = keyValue[0], value = keyValue[1];

    params[key] = params[key]?[value].concat(params[key]):value;
    return params;
  }
  return decodeURIComponent(window.location.search).
    replace(/^\?/, '').split('&').
    filter(identity).
    reduce(toKeyValue, {});
}