Ajouter à l'URL et rafraîchir la page

Question

Je cherche à écrire un morceau de javascript qui ajoutera un paramètre à l'URL actuelle et rafraîchira ensuite la page - comment puis-je faire cela ?

Answer 1

Ceci devrait fonctionner (non testé !)

var url = window.location.href;    
if (url.indexOf('?') > -1){
   url += '&param=1'
}else{
   url += '?param=1'
}
window.location.href = url;

Answer 2

Plus court que la réponse acceptée, en faisant la même chose, mais en restant simple :

window.location.search += '&param=42';

Il n'est pas nécessaire de modifier toute l'url, mais seulement la chaîne de requête, connue sous le nom d'attribut de recherche de l'emplacement.

Lorsque vous attribuez une valeur à l'attribut de recherche, le point d'interrogation est automatiquement inséré par le navigateur et la page est rechargée.

Answer 3

La plupart des réponses suggèrent d'ajouter le(s) paramètre(s) à l'URL, comme dans l'extrait suivant ou une variante similaire :

location.href = location.href + "&parameter=" + value;

Cela fonctionnera très bien dans la majorité des cas.

Cependant

À mon avis, ce n'est pas la bonne façon d'ajouter un paramètre à une URL.

Comme l'approche proposée ne vérifie pas si le paramètre est déjà défini dans l'URL, si l'on ne fait pas attention, on peut se retrouver avec une URL très longue avec le même paramètre répété plusieurs fois, par exemple :

https://stackoverflow.com/?&param=1&param=1&param=1&param=1&param=1&param=1&param=1&param=1&param=1

C'est à ce moment-là que les problèmes commencent. L'approche suggérée pourrait créer et créera une URL très longue après plusieurs rafraîchissements de la page, rendant ainsi l'URL invalide. Suivez ce lien pour plus d'informations sur les URL longues Quelle est la longueur maximale d'une URL dans les différents navigateurs ?

Voici l'approche que je propose :

function URL_add_parameter(url, param, value){
    var hash       = {};
    var parser     = document.createElement('a');

    parser.href    = url;

    var parameters = parser.search.split(/\?|&/);

    for(var i=0; i < parameters.length; i++) {
        if(!parameters[i])
            continue;

        var ary      = parameters[i].split('=');
        hash[ary[0]] = ary[1];
    }

    hash[param] = value;

    var list = [];  
    Object.keys(hash).forEach(function (key) {
        list.push(key + '=' + hash[key]);
    });

    parser.search = '?' + list.join('&');
    return parser.href;
}

Avec cette fonction, il suffit de faire ce qui suit :

location.href = URL_add_parameter(location.href, 'param', 'value');

Answer 4

Si vous développez pour un navigateur moderne Au lieu d'analyser les paramètres de l'url vous-même vous pouvez utiliser la fonction intégrée URL des fonctions pour le faire à votre place comme ça :

const parser = new URL(url || window.location);
parser.searchParams.set(key, value);
window.location = parser.href;

Answer 5

location.href = location.href + "&parameter=" + value;