Modifica parametri URL


189

Ho questo URL:

site.fwx?position=1&archiveid=5000&columns=5&rows=20&sorting=ModifiedTimeAsc

quello di cui ho bisogno è di essere in grado di cambiare il valore del parametro dell'URL "righe" in qualcosa che ho specificato, diciamo 10. E se le "righe" non esistono, devo aggiungerlo alla fine dell'URL e aggiungere il valore che ho già specificato (10).


2
Un leggero, risposta no-plugin: stackoverflow.com/a/10997390/11236
ripper234

11
Non posso credere che sia il 2013 e non esiste un modo migliore per farlo, come qualcosa incorporato nelle librerie del browser principale.
Tyler Collier,

Vedere la mia risposta per una soluzione moderna: stackoverflow.com/a/19965480/64949
Sindre Sorhus

6
@TylerCollier a metà 2015 ora e ancora niente :(
Tejas Manohar,

Risposte:


111

Ho esteso il codice di Sujoy per creare una funzione.

/**
 * http://stackoverflow.com/a/10997390/11236
 */
function updateURLParameter(url, param, paramVal){
    var newAdditionalURL = "";
    var tempArray = url.split("?");
    var baseURL = tempArray[0];
    var additionalURL = tempArray[1];
    var temp = "";
    if (additionalURL) {
        tempArray = additionalURL.split("&");
        for (var i=0; i<tempArray.length; i++){
            if(tempArray[i].split('=')[0] != param){
                newAdditionalURL += temp + tempArray[i];
                temp = "&";
            }
        }
    }

    var rows_txt = temp + "" + param + "=" + paramVal;
    return baseURL + "?" + newAdditionalURL + rows_txt;
}

Chiamate di funzione:

var newURL = updateURLParameter(window.location.href, 'locId', 'newLoc');
newURL = updateURLParameter(newURL, 'resId', 'newResId');

window.history.replaceState('', '', updateURLParameter(window.location.href, "param", "value"));

Versione aggiornata che si occupa anche delle ancore sull'URL.

function updateURLParameter(url, param, paramVal)
{
    var TheAnchor = null;
    var newAdditionalURL = "";
    var tempArray = url.split("?");
    var baseURL = tempArray[0];
    var additionalURL = tempArray[1];
    var temp = "";

    if (additionalURL) 
    {
        var tmpAnchor = additionalURL.split("#");
        var TheParams = tmpAnchor[0];
            TheAnchor = tmpAnchor[1];
        if(TheAnchor)
            additionalURL = TheParams;

        tempArray = additionalURL.split("&");

        for (var i=0; i<tempArray.length; i++)
        {
            if(tempArray[i].split('=')[0] != param)
            {
                newAdditionalURL += temp + tempArray[i];
                temp = "&";
            }
        }        
    }
    else
    {
        var tmpAnchor = baseURL.split("#");
        var TheParams = tmpAnchor[0];
            TheAnchor  = tmpAnchor[1];

        if(TheParams)
            baseURL = TheParams;
    }

    if(TheAnchor)
        paramVal += "#" + TheAnchor;

    var rows_txt = temp + "" + param + "=" + paramVal;
    return baseURL + "?" + newAdditionalURL + rows_txt;
}

Non riesco a farlo funzionare. Ecco il mio codice: jsfiddle.net/Draven/tTPYL/1 L'URL dovrebbe apparire http://www.domain.com/index.php?action=my_action&view-all=Yese devo cambiare il valore "visualizza tutto". La mia domanda SO che è stata chiusa: stackoverflow.com/questions/13025880/…
Draven

Sei sicuro? ha funzionato facilmente per me. Dai
Adil Malik,

1
Utilizzare "var i = 0" anziché "i = 0" per impedire la creazione / modifica di i come variabile globale.
Jonathan Aquino,

1
Coppia di altri problemi con questa funzione: (1) paramVal non è codificato in uri. (2) se paramVal è null, si ottiene foo = null. Dovrebbe essere foo = (o ancora meglio, rimuovere foo completamente).
Jonathan Aquino,

Questo ha reso la mia vita molto più semplice. Grazie mille amico!
boydenhartog,

97

Penso che tu voglia il plugin di query .

Per esempio:

window.location.search = jQuery.query.set("rows", 10);

Funzionerà indipendentemente dallo stato corrente delle righe.


Mofle, questo perché il plug-in Query utilizza decodeURIComponent e decodeURIComponent ("% F8") non è valido.
Matthew Flaschen,

2
Ottieni quelle strane cose dal tuo URL. Oppure, in altre parole, "modifica la stringa di query per utilizzare solo caratteri UTF-8 validi". :) F8 da solo non è un carattere UTF-8 valido.
Matthew Flaschen,

C'è un modo per recuperare l'URL di base da questo plugin? Ad esempio, se il mio URL è " youtube.com/watch?v=PZootaxRh3M ", ottieni " youtube.com/watch "
Matt Norris,

3
@Wraith, non hai bisogno di un plugin per quello. E 'solo window.location.pathname.
Matthew Flaschen,

2
@MattNorris Non è necessario un plugin per questo, ma la risposta corretta è: window.location.host + window.location.pathname Nel tuo caso sarà "www.youtube.com/watch"
nktssh

68

Per rispondere alla mia domanda 4 anni dopo, dopo aver imparato molto. Soprattutto che non dovresti usare jQuery per tutto. Ho creato un modulo semplice che può analizzare / stringere una stringa di query. Ciò semplifica la modifica della stringa di query.

È possibile utilizzare la stringa di query come segue:

// parse the query string into an object
var q = queryString.parse(location.search);
// set the `row` property
q.rows = 10;
// convert the object to a query string
// and overwrite the existing query string
location.search = queryString.stringify(q);

1
Wow, questa è una soluzione brillantemente semplice. Grazie!
jetlej,

Funziona come un campione! Grazie Sindre 🏆🏆🏆 (tutto ciò che devi fare è minimizzare "query-string / index.js" e incollarlo in fondo al tuo js)
Ronnie Royston

1
Avere una libreria extra solo per quello sembra un po 'extra ...
Il Padrino,

jQuery era troppo per 1 funzione, quindi invece hai usato dattiloscritto, travis e molte altre dipendenze non-sviluppatore :)
Justin Meiners

@JustinMeiners Non commentare se non si ha nulla di utile per contribuire alla conversazione. TypeScript non è utilizzato da questo progetto. Travis è un elemento della configurazione, non una dipendenza.
Sindre Sorhus,

64

Piccola soluzione rapida in js puro, non sono necessari plug-in:

function replaceQueryParam(param, newval, search) {
    var regex = new RegExp("([?;&])" + param + "[^&;]*[;&]?");
    var query = search.replace(regex, "$1").replace(/&$/, '');

    return (query.length > 2 ? query + "&" : "?") + (newval ? param + "=" + newval : '');
}

Chiamalo così:

 window.location = '/mypage' + replaceQueryParam('rows', 55, window.location.search)

Oppure, se vuoi rimanere nella stessa pagina e sostituire più parametri:

 var str = window.location.search
 str = replaceQueryParam('rows', 55, str)
 str = replaceQueryParam('cols', 'no', str)
 window.location = window.location.pathname + str

modifica, grazie Luca: Per rimuovere il parametro del tutto, passare falseo nullper il valore: replaceQueryParam('rows', false, params). Poiché 0 è anche falso , specificare '0'.


2
anche per rimuovere un parametro usato dall'output fai questo: str = replaceQueryParam ('oldparam', false, str) - sostanzialmente metti un valore di tipo falso
Luke Wenke

1
ha problema, la duplicazione mio parametro per nessuna buona ragione, controllare questa soluzione simile stackoverflow.com/a/20420424/3160597
azerafati

@Bludream che il codice ha funzionato in produzione per anni. Non l'ho ancora visto duplicare un parametro. Puoi pubblicare una riproduzione o qualche informazione più costruttiva?
bronson,

@Bludream Ora capisco, è lo script a cui hai collegato che aggiungeva parametri duplicati. :)
Bronson,

1
@dVyper corretto, un valore errato rimuove completamente il parametro. Usa il testo '0' anziché il numero intero 0.
bronson,

62

Ben Alman ha un buon plug-in per query / url jquery qui che ti consente di manipolare facilmente la querystring.

Come richiesto -

Vai alla sua pagina di test qui

In firebug inserisci quanto segue nella console

jQuery.param.querystring(window.location.href, 'a=3&newValue=100');

Ti restituirà la seguente stringa di URL modificata

http://benalman.com/code/test/js-jquery-url-querystring.html?a=3&b=Y&c=Z&newValue=100#n=1&o=2&p=3

Si noti che il valore di una stringa di query per a è stato modificato da X a 3 e ha aggiunto il nuovo valore.

È quindi possibile utilizzare la nuova stringa url come desiderato, ad esempio utilizzando document.location = newUrl o modificare un collegamento di ancoraggio ecc


4
Non è jQuery.param.querystring invece di jQuery.queryString?
Petr Peller,

12
TypeError: jQuery.param.querystring is not a function
TMS

1
Per avere 'TypeError' dovrebbe essere: jQuery.queryString (window.location.href, 'a = 3 & newValue = 100')
code-gijoe

2
dovresti chiamare jQuery.param.querystring. Immagino che abbiano refactored la biblioteca.
Will Wu

Nessuna di queste funzioni esiste più. Vuoi aggiornare window.location.search manualmente. Diventa più difficile se non vuoi ridipingere la pagina, poiché ciò causerà un cambio di pagina.
Monokrome,

39

Un approccio moderno a questo consiste nell'utilizzare URLSearchParams basati su standard nativi . È supportato da tutti i principali browser, ad eccezione di IE in cui sono disponibili i polyfill

const paramsString = "site.fwx?position=1&archiveid=5000&columns=5&rows=20&sorting=ModifiedTimeAsc"
const searchParams = new URLSearchParams(paramsString);
searchParams.set('rows', 10);
console.log(searchParams.toString()); // return modified string.

1
Sarebbe davvero bello ... ma non è come IE non lo supporta affatto, e l'utilizzo di polyfill per una cosa così piccola è totalmente fuori discussione.
Forsberg,

1
anche questo codifica per intero il parametro originaleString, quindi il risultato sembra site.fwx%3Fposition=1&archiveid=5000&columns=5&rows=10&sorting=ModifiedTimeAscconfuso perché non è quello che avresti costruito se lo avessi fatto manualmente ...
Ben Wheeler

1
Sarebbe bello vedere un esempio di come usarlo. Voglio dire, come ottenere la stringa params dalla pagina corrente e come impostarla in seguito
Il Padrino,

27

puoi farlo anche tramite il normale JS

var url = document.URL
var newAdditionalURL = "";
var tempArray = url.split("?");
var baseURL = tempArray[0];
var aditionalURL = tempArray[1]; 
var temp = "";
if(aditionalURL)
{
var tempArray = aditionalURL.split("&");
for ( var i in tempArray ){
    if(tempArray[i].indexOf("rows") == -1){
            newAdditionalURL += temp+tempArray[i];
                temp = "&";
            }
        }
}
var rows_txt = temp+"rows=10";
var finalURL = baseURL+"?"+newAdditionalURL+rows_txt;

Bello! L'ho preso e modificato in una funzione. Si invia l'URL corrente, il nome del parametro che si sta cercando, il nuovo valore e un bool che lo dice se si desidera aggiungere il parametro alla stringa di query se non lo trovo al momento. La funzione restituisce l'URL modificato.
Gromer,

Gormer, devi condividere questa funzione con gli altri :)
Adil Malik,

Frammento fantastico. Anch'io l'ho trasformato in una funzione per il mio caso d'uso. Grazie per la condivisione! +1
robabby,

19

Questo è il modo moderno di modificare i parametri URL:

function setGetParam(key,value) {
  if (history.pushState) {
    var params = new URLSearchParams(window.location.search);
    params.set(key, value);
    var newUrl = window.location.protocol + "//" + window.location.host + window.location.pathname + '?' + params.toString();
    window.history.pushState({path:newUrl},'',newUrl);
  }
}

2
Questa soluzione non è attualmente supportata in Internet Explorer 11: caniuse.com/#search=URLSearchParams
WoIIe

La stessa risposta ti è stata risposta un anno e mezzo prima di @Alister
FantomX1

10

Un'alternativa praticabile alla manipolazione di stringhe sarebbe quella di impostare un codice HTML forme modificare semplicemente il valore rowsdell'elemento?

Quindi, con htmlquello è qualcosa di simile

<form id='myForm' target='site.fwx'>
    <input type='hidden' name='position' value='1'/>
    <input type='hidden' name='archiveid' value='5000'/>
    <input type='hidden' name='columns' value='5'/>
    <input type='hidden' name='rows' value='20'/>
    <input type='hidden' name='sorting' value='ModifiedTimeAsc'/>
</form>

Con il seguente JavaScript per inviare il modulo

var myForm = document.getElementById('myForm');
myForm.rows.value = yourNewValue;
myForm.submit();

Probabilmente non adatto a tutte le situazioni, ma potrebbe essere più bello dell'analisi della stringa URL.


È intelligente.
Icarito,

7

Puoi usare questa mia biblioteca per fare il lavoro: https://github.com/Mikhus/jsurl

var url = new Url('site.fwx?position=1&archiveid=5000&columns=5&rows=20&sorting=ModifiedTimeAsc');
url.query.rows = 10;
alert( url);

4

2020 Soluzione : imposta la variabile o la rimuove se si passa nullo undefinedal valore.

var setSearchParam = function(key, value) {
    if (!window.history.pushState) {
        return;
    }

    if (!key) {
        return;
    }

    var url = new URL(window.location.href);
    var params = new window.URLSearchParams(window.location.search);
    if (value === undefined || value === null) {
        params.delete(key);
    } else {
        params.set(key, value);
    }

    url.search = params;
    url = url.toString();
    window.history.replaceState({url: url}, null, url);
}

Si noti che URLSearchParamsnon funziona nelle ultime versioni di tutti i principali browser (2020)
Oliver Schimmer il


È supportato in tutti i principali browser tranne IE11: caniuse.com/#search=URLSearchParams
Luis Paulo Lohmann,

Anche se ha iniziato a essere supportato, la stessa risposta con URLSearchParams ha ricevuto risposta a questa domanda almeno 3 volte già con risposta 15 gennaio 17 alle 15:24, risposta 14 giugno 18 alle 15:54 e risposta 1 marzo 19 alle 12:46, come se nessuno di voi leggesse le risposte prima di pubblicare
FantomX1

tutti i post hanno problemi minori che devono essere risolti. quindi lascia votare gli utenti e scegli quello migliore.
Alper Ebicoglu,

3

Ho scritto una piccola funzione di supporto che funziona con qualsiasi selezione. Tutto quello che devi fare è aggiungere la classe "redirectOnChange" a qualsiasi elemento select, e questo farà ricaricare la pagina con un parametro querystring nuovo / modificato, uguale all'id e al valore della selezione, ad es .:

<select id="myValue" class="redirectOnChange"> 
    <option value="222">test222</option>
    <option value="333">test333</option>
</select>

L'esempio sopra aggiungerebbe "? MyValue = 222" o "? MyValue = 333" (o usando "&" se esistono altri parametri) e ricaricare la pagina.

jQuery:

$(document).ready(function () {

    //Redirect on Change
    $(".redirectOnChange").change(function () {
        var href = window.location.href.substring(0, window.location.href.indexOf('?'));
        var qs = window.location.href.substring(window.location.href.indexOf('?') + 1, window.location.href.length);
        var newParam = $(this).attr("id") + '=' + $(this).val();

        if (qs.indexOf($(this).attr("id") + '=') == -1) {
            if (qs == '') {
                qs = '?'
            }
            else {
                qs = qs + '&'
            }
            qs = qs + newParam;

        }
        else {
            var start = qs.indexOf($(this).attr("id") + "=");
            var end = qs.indexOf("&", start);
            if (end == -1) {
                end = qs.length;
            }
            var curParam = qs.substring(start, end);
            qs = qs.replace(curParam, newParam);
        }
        window.location.replace(href + '?' + qs);
    });
});

Di gran lunga la migliore soluzione in questa pagina
ed209

2

Qui ho preso la risposta di Adil Malik e risolto i 3 problemi che ho identificato con esso.

/**
 * Adds or updates a URL parameter.
 *
 * @param {string} url  the URL to modify
 * @param {string} param  the name of the parameter
 * @param {string} paramVal  the new value for the parameter
 * @return {string}  the updated URL
 */
self.setParameter = function (url, param, paramVal){
  // http://stackoverflow.com/a/10997390/2391566
  var parts = url.split('?');
  var baseUrl = parts[0];
  var oldQueryString = parts[1];
  var newParameters = [];
  if (oldQueryString) {
    var oldParameters = oldQueryString.split('&');
    for (var i = 0; i < oldParameters.length; i++) {
      if(oldParameters[i].split('=')[0] != param) {
        newParameters.push(oldParameters[i]);
      }
    }
  }
  if (paramVal !== '' && paramVal !== null && typeof paramVal !== 'undefined') {
    newParameters.push(param + '=' + encodeURI(paramVal));
  }
  if (newParameters.length > 0) {
    return baseUrl + '?' + newParameters.join('&');
  } else {
    return baseUrl;
  }
}

1

Ecco cosa faccio. Utilizzando la mia funzione editParams (), è possibile aggiungere, rimuovere o modificare qualsiasi parametro, quindi utilizzare la funzione built-in replaceState () per aggiornare l'URL:

window.history.replaceState('object or string', 'Title', 'page.html' + editParams('sorting', ModifiedTimeAsc));


// background functions below:

// add/change/remove URL parameter
// use a value of false to remove parameter
// returns a url-style string
function editParams (key, value) {
  key = encodeURI(key);

  var params = getSearchParameters();

  if (Object.keys(params).length === 0) {
    if (value !== false)
      return '?' + key + '=' + encodeURI(value);
    else
      return '';
  }

  if (value !== false)
    params[key] = encodeURI(value);
  else
    delete params[key];

  if (Object.keys(params).length === 0)
    return '';

  return '?' + $.map(params, function (value, key) {
    return key + '=' + value;
  }).join('&');
}

// Get object/associative array of URL parameters
function getSearchParameters () {
  var prmstr = window.location.search.substr(1);
  return prmstr !== null && prmstr !== "" ? transformToAssocArray(prmstr) : {};
}

// convert parameters from url-style string to associative array
function transformToAssocArray (prmstr) {
  var params = {},
      prmarr = prmstr.split("&");

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

Un downvote senza un commento? Cosa c'è che non va nel codice? Funziona alla grande in molte situazioni.
Bobb Fwed,

1

La mia soluzione:

const setParams = (data) => {
    if (typeof data !== 'undefined' && typeof data !== 'object') {
        return
    }

    let url = new URL(window.location.href)
    const params = new URLSearchParams(url.search)

    for (const key of Object.keys(data)) {
        if (data[key] == 0) {
            params.delete(key)
        } else {
            params.set(key, data[key])
        }
    }

    url.search = params
    url = url.toString()
    window.history.replaceState({ url: url }, null, url)
}

Quindi chiama "setParams" e passa un oggetto con i dati che desideri impostare.

Esempio:

$('select').on('change', e => {
    const $this = $(e.currentTarget)
    setParams({ $this.attr('name'): $this.val() })
})

Nel mio caso ho dovuto aggiornare un input html select quando cambia e se il valore è "0", rimuovere il parametro. È possibile modificare la funzione e rimuovere il parametro dall'URL se anche la chiave dell'oggetto è "null".

Spero che questo ti aiuti


ci sono già 2 stesse risposte con URLSearchParams prima di te, come se nessuno di voi leggesse davvero le risposte. Pubblicato il 15 gennaio 17 alle 15:24, ha risposto il 14 giugno 18 alle
15:54

0

Un'altra variazione sulla risposta di Sujoy. Ho appena cambiato i nomi delle variabili e aggiunto un wrapper dello spazio dei nomi:

window.MyNamespace = window.MyNamespace  || {};
window.MyNamespace.Uri = window.MyNamespace.Uri || {};

(function (ns) {

    ns.SetQueryStringParameter = function(url, parameterName, parameterValue) {

        var otherQueryStringParameters = "";

        var urlParts = url.split("?");

        var baseUrl = urlParts[0];
        var queryString = urlParts[1];

        var itemSeparator = "";
        if (queryString) {

            var queryStringParts = queryString.split("&");

            for (var i = 0; i < queryStringParts.length; i++){

                if(queryStringParts[i].split('=')[0] != parameterName){

                    otherQueryStringParameters += itemSeparator + queryStringParts[i];
                    itemSeparator = "&";
                }
            }
        }

        var newQueryStringParameter = itemSeparator + parameterName + "=" + parameterValue;

        return baseUrl + "?" + otherQueryStringParameters + newQueryStringParameter;
    };

})(window.MyNamespace.Uri);

L'utilizzo è ora:

var changedUrl = MyNamespace.Uri.SetQueryStringParameter(originalUrl, "CarType", "Ford");

0

Anch'io ho scritto una libreria per ottenere e impostare i parametri di query URL in JavaScript .

Ecco un esempio del suo utilizzo.

var url = Qurl.create()
  , query
  , foo
  ;

Ottieni parametri di query come oggetto, per chiave o aggiungi / cambia / rimuovi.

// returns { foo: 'bar', baz: 'qux' } for ?foo=bar&baz=qux
query = url.query();

// get the current value of foo
foo = url.query('foo');

// set ?foo=bar&baz=qux
url.query('foo', 'bar');
url.query('baz', 'qux');

// unset foo, leaving ?baz=qux
url.query('foo', false); // unsets foo


-1

So che questa è una vecchia domanda. Ho migliorato la funzione sopra per aggiungere o aggiornare i parametri della query. Ancora solo una soluzione JS pura.

                      function addOrUpdateQueryParam(param, newval, search) {

                        var questionIndex = search.indexOf('?');

                        if (questionIndex < 0) {
                            search = search + '?';
                            search = search + param + '=' + newval;
                            return search;
                        }

                        var regex = new RegExp("([?;&])" + param + "[^&;]*[;&]?");
                        var query = search.replace(regex, "$1").replace(/&$/, '');

                        var indexOfEquals = query.indexOf('=');

                        return (indexOfEquals >= 0 ? query + '&' : query + '') + (newval ? param + '=' + newval : '');
                    }

-1

la mia funzione supporta la rimozione di param

function updateURLParameter(url, param, paramVal, remove = false) {
        var newAdditionalURL = '';
        var tempArray = url.split('?');
        var baseURL = tempArray[0];
        var additionalURL = tempArray[1];
        var rows_txt = '';

        if (additionalURL)
            newAdditionalURL = decodeURI(additionalURL) + '&';

        if (remove)
            newAdditionalURL = newAdditionalURL.replace(param + '=' + paramVal, '');
        else
            rows_txt = param + '=' + paramVal;

        window.history.replaceState('', '', (baseURL + "?" + newAdditionalURL + rows_txt).replace('?&', '?').replace('&&', '&').replace(/\&$/, ''));
    }

-1

Ho appena scritto un semplice modulo per gestire la lettura e l'aggiornamento dei parametri della query URL corrente.

Esempio di utilizzo:

import UrlParams from './UrlParams'

UrlParams.remove('foo') //removes all occurences of foo=?
UrlParams.set('foo', 'bar') //set all occurences of foo equal to bar
UrlParams.add('foo', 'bar2') //add bar2 to foo result: foo=bar&foo=bar2
UrlParams.get('foo') //returns bar
UrlParams.get('foo', true) //returns [bar, bar2]

Ecco il mio codice chiamato UrlParams. (Js / ts):

class UrlParams {

    /**
     * Get params from current url
     * 
     * @returns URLSearchParams
     */
    static getParams(){
        let url = new URL(window.location.href)
        return new URLSearchParams(url.search.slice(1))
    }

    /**
     * Update current url with params
     * 
     * @param params URLSearchParams
     */
    static update(params){
        if(`${params}`){
            window.history.replaceState({}, '', `${location.pathname}?${params}`)
        } else {
            window.history.replaceState({}, '', `${location.pathname}`)
        }
    }

    /**
     * Remove key from url query
     * 
     * @param param string
     */
    static remove(param){
        let params = this.getParams()
        if(params.has(param)){
            params.delete(param)
            this.update(params)
        }
    }

    /**
     * Add key value pair to current url
     * 
     * @param key string
     * @param value string
     */
    static add(key, value){
        let params = this.getParams()
        params.append(key, value)
        this.update(params)
    }

    /**
     * Get value or values of key
     * 
     * @param param string
     * @param all string | string[]
     */
    static get(param, all=false){
        let params = this.getParams()
        if(all){
            return params.getAll(param)
        }
        return params.get(param)
    }

    /**
     * Set value of query param
     * 
     * @param key string
     * @param value string
     */
    static set(key, value){
        let params = this.getParams()
        params.set(key, value)
        this.update(params)
    }

}
export default UrlParams
export { UrlParams }

Ci sono già 4 risposte che hai menzionato postato, risposto 15 gennaio 17 alle 15:24, risposta 14 giugno 18 alle 15:54, risposta 1 marzo 19 alle 12:46 e risposta 14 giugno 19 alle 7: 20, come se nessuno di voi leggesse le risposte prima di pubblicare
FantomX1

-2
     // usage: clear ; cd src/js/node/js-unit-tests/01-set-url-param ; npm test ; cd -
     // prereqs: , nodejs , mocha
     // URI = scheme:[//authority]path[?paramName1=paramValue1&paramName2=paramValue2][#fragment]
     // call by: uri = uri.setUriParam("as","md")
     String.prototype.setUriParam = function (paramName, paramValue) {
        var uri = this
        var fragment = ( uri.indexOf('#') === -1 ) ? '' : uri.split('#')[1]
        uri = ( uri.indexOf('#') === -1 ) ? uri : uri.split('#')[0]
        if ( uri.indexOf("?") === -1 ) { uri = uri + '?&' }
        uri = uri.replace ( '?' + paramName , '?&' + paramName)
        var toRepl = (paramValue != null) ? ('$1' + paramValue) : ''
        var toSrch = new RegExp('([&]' + paramName + '=)(([^&#]*)?)')
        uri = uri.replace(toSrch,toRepl)
        if (uri.indexOf(paramName + '=') === -1 && toRepl != '' ) {
           var ampersandMayBe = uri.endsWith('&') ? '' : '&'
           uri = uri + ampersandMayBe + paramName + "=" + String(paramValue)
        }
        uri = ( fragment.length == 0 ) ? uri : (uri+"#"+fragment) //may-be re-add the fragment
        return uri
     }

     var assert = require('assert');
     describe('replacing url param value', function () {

        // scheme://authority/path[?p1=v1&p2=v2#fragment
        // a clean url
        it('http://org.com/path -> http://org.com/path?&prm=tgt_v', function (){
           var uri = 'http://site.eu:80/qto/view/devops_guide_doc'
           var uriExpected = 'http://site.eu:80/qto/view/devops_guide_doc?&bid=10'
           var uriActual = uri.setUriParam("bid",10)
           assert.equal(uriActual, uriExpected);
        });

        // has the url param existing after the ? with num value
        it('http://org.com/path?prm=src_v -> http://org.com/path?&prm=tgt_v', function (){
           var uri = 'http://site.eu:80/qto/view/devops_guide_doc?bid=57'
           var uriExpected = 'http://site.eu:80/qto/view/devops_guide_doc?&bid=10'
           var uriActual = uri.setUriParam("bid",10)
           assert.equal(uriActual, uriExpected);
        });

        // has the url param existing after the ? but string value
        it('http://org.com/path?prm=src_v -> http://org.com/path?&prm=tgt_v', function (){
           var uri = 'http://site.eu:80/qto/view/devops_guide_doc?bid=boo-bar'
           var uriExpected = 'http://site.eu:80/qto/view/devops_guide_doc?&bid=boo-bar-baz'
           var uriActual = uri.setUriParam("bid","boo-bar-baz")
           assert.equal(uriActual, uriExpected);
        });

        // has the url param existing after the ?& but string value
        it('http://org.com/path?&prm=src_v -> http://org.com/path?&prm=tgt_v', function (){
           var uri = 'http://site.eu:80/qto/view/devops_guide_doc?&bid=5'
           var uriExpected = 'http://site.eu:80/qto/view/devops_guide_doc?&bid=10'
           var uriActual = uri.setUriParam("bid",10)
           assert.equal(uriActual, uriExpected);
        });

        // has the url param existing after the ? with other param
        it('http://org.com/path?prm=src_v&other_p=other_v -> http://org.com/path?&prm=tgt_v&other_p=other_v', function (){
           var uri = 'http://site.eu:80/qto/view/devops_guide_doc?bid=5&other_p=other_v'
           var uriExpected = 'http://site.eu:80/qto/view/devops_guide_doc?&bid=10&other_p=other_v'
           var uriActual = uri.setUriParam("bid",10)
           assert.equal(uriActual, uriExpected);
        });

        // has the url param existing after the ?& with other param
        it('http://org.com/path?&prm=src_v&other_p=other_v -> http://org.com/path?&prm=tgt_v&other_p=other_v', function (){
           var uri = 'http://site.eu:80/qto/view/devops_guide_doc?&bid=5&other_p&other_v'
           var uriExpected = 'http://site.eu:80/qto/view/devops_guide_doc?&bid=10&other_p&other_v'
           var uriActual = uri.setUriParam("bid",10)
           assert.equal(uriActual, uriExpected);
        });

        // has the url param existing after the ? with other param with fragment
        it('http://org.com/path?prm=src_v&other_p=other_v#f -> http://org.com/path?&prm=tgt_v&other_p=other_v#f', function (){
           var uri = 'http://site.eu:80/qto/view/devops_guide_doc?bid=5&other_p=other_v#f'
           var uriExpected = 'http://site.eu:80/qto/view/devops_guide_doc?&bid=10&other_p=other_v#f'
           var uriActual = uri.setUriParam("bid",10)
           assert.equal(uriActual, uriExpected);
        });

        // has the url param existing after the ?& with other param with fragment
        it('http://org.com/path?&prm=src_v&other_p=other_v#f -> http://org.com/path?&prm=tgt_v&other_p=other_v#f', function (){
           var uri = 'http://site.eu:80/qto/view/devops_guide_doc?&bid=5&other_p&other_v#f'
           var uriExpected = 'http://site.eu:80/qto/view/devops_guide_doc?&bid=10&other_p&other_v#f'
           var uriActual = uri.setUriParam("bid",10)
           assert.equal(uriActual, uriExpected);
        });

        // remove the param-name , param-value pair
        it('http://org.com/path?prm=src_v&other_p=other_v#f -> http://org.com/path?&prm=tgt_v&other_p=other_v#f', function (){
           var uri = 'http://site.eu:80/qto/view/devops_guide_doc?bid=5&other_p=other_v#f'
           var uriExpected = 'http://site.eu:80/qto/view/devops_guide_doc?&other_p=other_v#f'
           var uriActual = uri.setUriParam("bid",null)
           assert.equal(uriActual, uriExpected);
        });

        // remove the param-name , param-value pair
        it('http://org.com/path?&prm=src_v&other_p=other_v#f -> http://org.com/path?&prm=tgt_v&other_p=other_v#f', function (){
           var uri = 'http://site.eu:80/qto/view/devops_guide_doc?&bid=5&other_p=other_v#f'
           var uriExpected = 'http://site.eu:80/qto/view/devops_guide_doc?&other_p=other_v#f'
           var uriActual = uri.setUriParam("bid",null)
           assert.equal(uriActual, uriExpected);
        });

        // add a new param name , param value pair
        it('http://org.com/path?prm=src_v&other_p=other_v#f -> http://org.com/path?&prm=tgt_v&other_p=other_v#f', function (){
           var uri = 'http://site.eu:80/qto/view/devops_guide_doc?&other_p=other_v#f'
           var uriExpected = 'http://site.eu:80/qto/view/devops_guide_doc?&other_p=other_v&bid=foo-bar#f'
           var uriActual = uri.setUriParam("bid","foo-bar")
           assert.equal(uriActual, uriExpected);
        });

     });
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.