Remove all query string in bulk from url?

Question

We want to remove multiple query string parameters from given url. For example:

If url is:

https://www.example.com?budget=0-&year=0-&kms=0-&so=-1&sc=-1&pn=1

and if query string parameters to be removed are: "so","kms","pn", the output of that function should be:

https://www.example.com?budget=0-&year=0-&sc=-1

We have written following code for this:

var input = "https://www.example.com?budget=0-&year=0-&kms=0-&so=-1&sc=-1&pn=1";
var url = input.replace('?', '');
var removeFilterSet = {"so" : true,"kms" : true,"pn" : true};
var params = url.split("&");
for(var i = params.length ; i-- > 0  ; )
{
    if(removeFilterSet[params[i].split("=")[0]])
    {
        params.splice(i,1);
    }
}
alert(params.join("&"));

Is there any better way to remove query string in bulk from url?

You can have a look at these answers https://stackoverflow.com/questions/2540969/remove-querystring-from-url and https://stackoverflow.com/questions/1634748/how-can-i-delete-a-query-string-parameter-in-javascript — Lalit, Sep 19 '17 at 13:08

Jonas Wilms · Answer 1 · 2017-09-19T13:28:55.143

2

One could use a Map for that:

const url = "https://www.example.com?budget=0-&year=0-&kms=0-&so=-1&sc=-1&pn=1";
//divide the url into domain and query
const [domain,query] = url.split("?");
//build a Map out of the query string
const params = new Map(
 query.split("&").map(el=>el.split("="))
);

//modification goes here, e.g:

["year","so","sc","pm"].forEach(q => params.delete(q));

/* or to replace a value
params.set("whatever","value")
*/

//build up again:

const result = domain+"?"+[...params].map(el=>el.join("=")).join("&");

Try it

edited Sep 19 '17 at 13:28

answered Sep 19 '17 at 13:26

Jonas Wilms

132,000
20
149
151

1

great answer. Only issue here is that its compatible only for ES6? – Sahil Sharma Sep 19 '17 at 13:27

score 0 · Answer 2 · edited Dec 13 '18 at 10:53

0

Yes - use a library rather than try and do anything complicated. I recommend URIJS, which does it like this:

var uri = new URI("https://www.example.com?budget=0-&year=0-&kms=0-&so=-1&sc=-1&pn=1");
uri.removeSearch(["so", "kms", "pn"]);
alert( uri.toString() );

See https://medialize.github.io/URI.js/docs.html#search-remove for details.

edited Dec 13 '18 at 10:53

Cardin

5,148
5
36
37

answered Sep 19 '17 at 13:08

Duncan Thacker

5,073
1
10
20

score 0 · Answer 3 · answered Sep 19 '17 at 13:10

You can use this code that use the most of the split() function to achieve the desired goal:

var input = "https://www.example.com?budget=0-&year=0-&kms=0-&so=-1&sc=-1&pn=1";

var domain = input.split("?")[0];
var queryStrings = input.split("?")[1].split('&');
var removeFilterSet = {"so" : true,"kms" : true,"pn" : true};

var resArray = [];
queryStrings.forEach(function(value, key){
   var queryName = value.split('=')[0];
   if(!removeFilterSet[queryName]){
     resArray.push(value);
   }
});

var finalUrl = domain+'?'+resArray.toString().replace(/,/g,'&');
console.log(finalUrl);

score 0 · Answer 4 · answered Sep 19 '17 at 13:32

Here a solution using Array.prototype.reduce():

let input = "https://www.example.com?budget=0-&year=0-&kms=0-&so=-1&sc=-1&pn=1",
    [domain, qs] = input.split('?'),
    removeFilterSet = ['so', 'kms', 'pn'],
    filtered = qs.split('&').reduce((acc, param) => {
        return removeFilterSet.includes(param.split('=')[0]) ?
            acc : `${acc}&${param}`;
    }, '');
console.log(domain + '?' + filtered);

score 0 · Answer 5 · answered Dec 03 '19 at 16:06

Old post but here's my cleaner solution. I'm utilizing the lodash and query-string libraries.

import qs from "query-string";
import _ from "lodash";

let query = qs.parse(location.search);

_.map(query, function(value, key) {
        return delete query[key];
      });

Remove all query string in bulk from url?

5 Answers5