Create multiple query keys by URL & URLSearchParams

Question

I want to create url value which have multiple key values in JavaScript.

If I do like this,

    const url = new URL('http://example.com/hoge');
    url.search = new URLSearchParams(['a': ['b', 'c'], 'd': 'e']);
    console.log(url.href);

I achieved

http://example.com/hoge?a=b,c&d=e

But I want to have is

http://example.com/hoge?a=b&a=c&d=e

How can I get it?

are you sure using same key param used with in url multiple time a=b&a=c . while reading the query value is more annoying — prasanth
– prasanth, Commented Dec 9, 2020 at 8:11

boring91 · Accepted Answer · 2020-12-09 08:07:46Z

6

You can do it this way:

const p = new URLSearchParams();
p.append('a', 'b');
p.append('a', 'c');
p.append('d', 'e');

const url = new URL('http://example.com/hoge');
url.search = p;

console.log(url.href);

answered Dec 9, 2020 at 8:07

boring91

1,1512 gold badges12 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

myeongkil kim · Accepted Answer · 2020-12-09 08:09:54Z

1

How about using query-string node module

[!] This module targets Node.js 6 or later and the latest version of Chrome, Firefox, and Safari. If you want support for older browsers, or, if your project is using create-react-app v1, use version 5: npm install query-string@5.

const queryString = require('query-string');

let paramJson = {
    'a' : ['b', 'c'],
    'd' : 'e'
}

const url = new URL('http://example.com/hoge');
url.search = new URLSearchParams(queryString.stringify(paramJson));
console.log(url.href);
// http://example.com/hoge?a=b&a=c&d=e

answered Dec 9, 2020 at 8:09

myeongkil kim

2,5964 gold badges18 silver badges24 bronze badges

Collectives™ on Stack Overflow

Create multiple query keys by URL & URLSearchParams

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related