qs、query-string、querystring 和 url-search-params 都是用于处理 URL 查询参数(query parameters)的工具。它们的主要功能是将 URL 中的查询字符串(如 ?id=1&type=book)解析为 JavaScript 对象,或者将对象序列化为查询字符串。这在前端路由状态管理、API 请求参数构建以及服务端渲染中非常常见。虽然目标相同,但它们在嵌套对象支持、编码标准、运行环境依赖以及维护状态上存在显著差异。
在 Web 开发中,处理 URL 查询参数是一项基础但容易出错的任务。无论是从地址栏读取状态,还是构建 API 请求,我们都需要将字符串转换为对象,或者反过来。今天我们将深入对比四个主流方案:qs、query-string、querystring 和 url-search-params(原生 API 及 polyfill)。
所有这四个工具都提供了解析(parse)和序列化(stringify)的基本功能,但用法和默认行为有所不同。
qs 提供了高度可配置的解析和序列化,默认支持将字符串转换为嵌套对象。
import qs from 'qs';
// 解析
const obj = qs.parse('a=1&b=2');
// { a: '1', b: '2' }
// 序列化
const str = qs.stringify({ a: 1, b: 2 });
// 'a=1&b=2'
query-string 专注于浏览器环境,API 简洁,默认返回扁平对象。
import queryString from 'query-string';
// 解析
const obj = queryString.parse('?a=1&b=2');
// { a: '1', b: '2' }
// 序列化
const str = queryString.stringify({ a: 1, b: 2 });
// 'a=1&b=2'
querystring 是 Node.js 旧核心模块,API 较为古老,不支持前缀问号。
import querystring from 'querystring';
// 解析
const obj = querystring.parse('a=1&b=2');
// { a: '1', b: '2' }
// 序列化
const str = querystring.stringify({ a: 1, b: 2 });
// 'a=1&b=2'
url-search-params (原生 API) 使用类实例操作,不直接返回普通对象,需手动转换。
// 原生 API (或 url-search-params 包)
const params = new URLSearchParams('a=1&b=2');
// 解析 (需手动遍历)
const obj = Object.fromEntries(params.entries());
// { a: '1', b: '2' }
// 序列化
params.set('c', '3');
const str = params.toString();
// 'a=1&b=2&c=3'
这是区分这些库最关键的特性之一。当 URL 中包含数组或嵌套对象时(例如筛选器 ?filter[type]=book),不同工具的表现差异巨大。
qs 是处理嵌套结构的王者,默认开启括号解析。
import qs from 'qs';
const obj = qs.parse('user[name]=Tom&user[age]=30');
// { user: { name: 'Tom', age: '30' } }
const str = qs.stringify({ user: { name: 'Tom' } });
// 'user%5Bname%5D=Tom'
query-string 默认将嵌套语法视为普通字符串键,需配置才能部分支持。
import queryString from 'query-string';
const obj = queryString.parse('user[name]=Tom');
// { 'user[name]': 'Tom' } (默认行为,键名包含括号)
// 需要额外配置或手动处理才能转为嵌套对象,不如 qs 方便
querystring 完全不支持嵌套,所有键都视为扁平字符串。
import querystring from 'querystring';
const obj = querystring.parse('user[name]=Tom');
// { 'user[name]': 'Tom' } (无法自动转为对象结构)
url-search-params 原生仅支持扁平键值对,无法理解嵌套语法。
const params = new URLSearchParams('user[name]=Tom');
const obj = Object.fromEntries(params.entries());
// { 'user[name]': 'Tom' } (仅作为普通字符串键处理)
选择库时,了解其生命周期至关重要。使用已废弃的库会给项目带来安全隐患和维护成本。
qs 维护活跃,社区广泛使用,长期支持。
// 状态:活跃
// 建议:可安全用于生产环境
import qs from 'qs';
query-string 维护活跃,是前端生态的热门选择。
// 状态:活跃
// 建议:可安全用于生产环境
import queryString from 'query-string';
querystring 官方已废弃,Node.js 文档明确建议不再使用。
// 状态:已废弃 (Deprecated)
// 建议:不要在新项目中使用,迁移到 qs 或 URLSearchParams
import querystring from 'querystring'; // 避免使用
url-search-params 是 Web 标准,现代环境原生支持,无需额外包。
// 状态:Web 标准 (原生)
// 建议:优先使用原生 API,旧环境需 polyfill
const params = new URLSearchParams();
URL 编码规则复杂,不同的库对特殊字符(如空格、中文、符号)的处理方式不同,这可能导致后端解析失败。
qs 允许自定义编码函数,灵活性高,但默认行为可能需调整以匹配后端。
import qs from 'qs';
// 默认编码
qs.stringify({ q: 'a b' });
// 'q=a%20b'
// 自定义编码
qs.stringify({ q: 'a b' }, { encode: false });
// 'q=a b'
query-string 严格遵循 RFC 标准,对特殊字符编码更保守,适合标准 Web 场景。
import queryString from 'query-string';
queryString.stringify({ q: 'a b' });
// 'q=a%20b' (严格编码)
querystring 编码规则较旧,某些特殊字符处理与现代标准不一致。
import querystring from 'querystring';
querystring.stringify({ q: 'a b' });
// 'q=a%20b' (但某些符号行为可能不同)
url-search-params 使用浏览器或 Node 原生的编码实现,最符合当前平台标准。
const params = new URLSearchParams();
params.set('q', 'a b');
params.toString();
// 'q=a+b' (注意:URLSearchParams 通常将空格编码为 +)
部署环境决定了你能否使用原生 API,或者必须引入第三方库。
qs 是纯 JavaScript 库,无依赖,同构支持好(Node 和 浏览器均可)。
// anywhere
import qs from 'qs';
// 可以在 Webpack/Vite 打包后在浏览器运行,也可在 Node 运行
query-string 主要针对浏览器设计,但在 Node 中也可运行。
// primarily browser-focused
import queryString from 'query-string';
// 依赖 window.location 等对象时需小心,但核心逻辑通用
querystring 是 Node.js 特有,浏览器环境需 polyfill 或无法使用。
// Node.js only (Legacy)
import querystring from 'querystring';
// 在浏览器中直接导入会报错,除非使用构建工具 polyfill
url-search-params 现代浏览器和 Node.js 10+ 原生支持,无需打包。
// Native Standard
// 无需 npm install,直接使用
const p = new URLSearchParams(window.location.search);
| 特性 | qs | query-string | querystring | url-search-params |
|---|---|---|---|---|
| 嵌套对象 | ✅ 完美支持 | ⚠️ 需配置/有限 | ❌ 不支持 | ❌ 不支持 |
| 维护状态 | ✅ 活跃 | ✅ 活跃 | ❌ 已废弃 | ✅ 原生标准 |
| 环境 | 同构 (Node/Web) | 主要 Web | Node.js (旧) | 现代 Node/Web |
| 体积 | 中等 | 小 | 核心模块 | 0 (原生) |
| 编码 | 可配置 | 严格标准 | 旧标准 | 平台标准 |
qs 就像一把多功能瑞士军刀 🔪 — 当你需要处理复杂的后端数据交互、嵌套筛选条件,或者在 Express 服务端解析参数时,它是最可靠的选择。虽然体积稍大,但功能最全面。
query-string 像是一把精致的手术刀 🏥 — 适合前端路由场景,特别是 React 或 Vue 项目中,处理相对简单的查询参数,且对 URL 标准合规性要求较高时。
querystring 是博物馆里的展品 🏛️ — 虽然曾经无处不在,但现已废弃。如果你的代码库里还有它,请计划迁移到 qs 或原生 API。
url-search-params 是现代化的基础设施 🏗️ — 如果你的应用不需要嵌套对象支持,且只需处理扁平参数,原生 API 是性能最好、依赖最少的选择。
最终建议:
qs。query-string 或 原生 URLSearchParams。querystring。如果你的项目需要处理复杂的嵌套对象(例如 ?user[address][city]=NY),或者你在使用 Express 框架,qs 是首选。它是 Express 的默认解析库,对嵌套语法支持最完善,配置选项丰富,适合处理深层数据结构。
如果你主要在前端(浏览器)工作,特别是配合 React Router 或 Vue Router 使用,query-string 是很好的选择。它对 URL 编码的处理更严格,符合标准,且体积较小,适合处理扁平或轻度嵌套的查询参数。
不要在新项目中使用 querystring。它是 Node.js 的旧核心模块,官方已标记为废弃(deprecated)。它不支持嵌套对象解析,且不再维护,继续使用会带来长期的技术债务和兼容性风险。
如果你的目标环境是现代浏览器或 Node.js 10+,直接使用原生的 URLSearchParams API(或对应的 polyfill 包)。它无需额外依赖,性能最好,适合处理扁平的键值对。但如果需要嵌套对象支持,它原生并不具备此能力。
A querystring parsing and stringifying library with some added security.
Lead Maintainer: Jordan Harband
The qs module was originally created and maintained by TJ Holowaychuk.
var qs = require('qs');
var assert = require('assert');
var obj = qs.parse('a=c');
assert.deepEqual(obj, { a: 'c' });
var str = qs.stringify(obj);
assert.equal(str, 'a=c');
qs.parse(string, [options]);
qs allows you to create nested objects within your query strings, by surrounding the name of sub-keys with square brackets [].
For example, the string 'foo[bar]=baz' converts to:
assert.deepEqual(qs.parse('foo[bar]=baz'), {
foo: {
bar: 'baz'
}
});
When using the plainObjects option the parsed value is returned as a null object, created via { __proto__: null } and as such you should be aware that prototype methods will not exist on it and a user may set those names to whatever value they like:
var nullObject = qs.parse('a[hasOwnProperty]=b', { plainObjects: true });
assert.deepEqual(nullObject, { a: { hasOwnProperty: 'b' } });
By default parameters that would overwrite properties on the object prototype are ignored, if you wish to keep the data from those fields either use plainObjects as mentioned above, or set allowPrototypes to true which will allow user input to overwrite those properties.
WARNING It is generally a bad idea to enable this option as it can cause problems when attempting to use the properties that have been overwritten.
Always be careful with this option.
var protoObject = qs.parse('a[hasOwnProperty]=b', { allowPrototypes: true });
assert.deepEqual(protoObject, { a: { hasOwnProperty: 'b' } });
URI encoded strings work too:
assert.deepEqual(qs.parse('a%5Bb%5D=c'), {
a: { b: 'c' }
});
You can also nest your objects, like 'foo[bar][baz]=foobarbaz':
assert.deepEqual(qs.parse('foo[bar][baz]=foobarbaz'), {
foo: {
bar: {
baz: 'foobarbaz'
}
}
});
By default, when nesting objects qs will only parse up to 5 children deep.
This means if you attempt to parse a string like 'a[b][c][d][e][f][g][h][i]=j' your resulting object will be:
var expected = {
a: {
b: {
c: {
d: {
e: {
f: {
'[g][h][i]': 'j'
}
}
}
}
}
}
};
var string = 'a[b][c][d][e][f][g][h][i]=j';
assert.deepEqual(qs.parse(string), expected);
This depth can be overridden by passing a depth option to qs.parse(string, [options]):
var deep = qs.parse('a[b][c][d][e][f][g][h][i]=j', { depth: 1 });
assert.deepEqual(deep, { a: { b: { '[c][d][e][f][g][h][i]': 'j' } } });
You can configure qs to throw an error when parsing nested input beyond this depth using the strictDepth option (defaulted to false):
try {
qs.parse('a[b][c][d][e][f][g][h][i]=j', { depth: 1, strictDepth: true });
} catch (err) {
assert(err instanceof RangeError);
assert.strictEqual(err.message, 'Input depth exceeded depth option of 1 and strictDepth is true');
}
The depth limit helps mitigate abuse when qs is used to parse user input, and it is recommended to keep it a reasonably small number. The strictDepth option adds a layer of protection by throwing an error when the limit is exceeded, allowing you to catch and handle such cases.
For similar reasons, by default qs will only parse up to 1000 parameters. This can be overridden by passing a parameterLimit option:
var limited = qs.parse('a=b&c=d', { parameterLimit: 1 });
assert.deepEqual(limited, { a: 'b' });
If you want an error to be thrown whenever the a limit is exceeded (eg, parameterLimit, arrayLimit), set the throwOnLimitExceeded option to true. This option will generate a descriptive error if the query string exceeds a configured limit.
try {
qs.parse('a=1&b=2&c=3&d=4', { parameterLimit: 3, throwOnLimitExceeded: true });
} catch (err) {
assert(err instanceof Error);
assert.strictEqual(err.message, 'Parameter limit exceeded. Only 3 parameters allowed.');
}
When throwOnLimitExceeded is set to false (default), qs will parse up to the specified parameterLimit and ignore the rest without throwing an error.
To bypass the leading question mark, use ignoreQueryPrefix:
var prefixed = qs.parse('?a=b&c=d', { ignoreQueryPrefix: true });
assert.deepEqual(prefixed, { a: 'b', c: 'd' });
An optional delimiter can also be passed:
var delimited = qs.parse('a=b;c=d', { delimiter: ';' });
assert.deepEqual(delimited, { a: 'b', c: 'd' });
Delimiters can be a regular expression too:
var regexed = qs.parse('a=b;c=d,e=f', { delimiter: /[;,]/ });
assert.deepEqual(regexed, { a: 'b', c: 'd', e: 'f' });
Option allowDots can be used to enable dot notation:
var withDots = qs.parse('a.b=c', { allowDots: true });
assert.deepEqual(withDots, { a: { b: 'c' } });
Option decodeDotInKeys can be used to decode dots in keys
Note: it implies allowDots, so parse will error if you set decodeDotInKeys to true, and allowDots to false.
var withDots = qs.parse('name%252Eobj.first=John&name%252Eobj.last=Doe', { decodeDotInKeys: true });
assert.deepEqual(withDots, { 'name.obj': { first: 'John', last: 'Doe' }});
Option allowEmptyArrays can be used to allow empty array values in an object
var withEmptyArrays = qs.parse('foo[]&bar=baz', { allowEmptyArrays: true });
assert.deepEqual(withEmptyArrays, { foo: [], bar: 'baz' });
Option duplicates can be used to change the behavior when duplicate keys are encountered
assert.deepEqual(qs.parse('foo=bar&foo=baz'), { foo: ['bar', 'baz'] });
assert.deepEqual(qs.parse('foo=bar&foo=baz', { duplicates: 'combine' }), { foo: ['bar', 'baz'] });
assert.deepEqual(qs.parse('foo=bar&foo=baz', { duplicates: 'first' }), { foo: 'bar' });
assert.deepEqual(qs.parse('foo=bar&foo=baz', { duplicates: 'last' }), { foo: 'baz' });
Note that keys with bracket notation ([]) always combine into arrays, regardless of the duplicates setting:
assert.deepEqual(qs.parse('a=1&a=2&b[]=1&b[]=2', { duplicates: 'last' }), { a: '2', b: ['1', '2'] });
If you have to deal with legacy browsers or services, there's also support for decoding percent-encoded octets as iso-8859-1:
var oldCharset = qs.parse('a=%A7', { charset: 'iso-8859-1' });
assert.deepEqual(oldCharset, { a: '§' });
Some services add an initial utf8=✓ value to forms so that old Internet Explorer versions are more likely to submit the form as utf-8.
Additionally, the server can check the value against wrong encodings of the checkmark character and detect that a query string or application/x-www-form-urlencoded body was not sent as utf-8, eg. if the form had an accept-charset parameter or the containing page had a different character set.
qs supports this mechanism via the charsetSentinel option.
If specified, the utf8 parameter will be omitted from the returned object.
It will be used to switch to iso-8859-1/utf-8 mode depending on how the checkmark is encoded.
Important: When you specify both the charset option and the charsetSentinel option, the charset will be overridden when the request contains a utf8 parameter from which the actual charset can be deduced.
In that sense the charset will behave as the default charset rather than the authoritative charset.
var detectedAsUtf8 = qs.parse('utf8=%E2%9C%93&a=%C3%B8', {
charset: 'iso-8859-1',
charsetSentinel: true
});
assert.deepEqual(detectedAsUtf8, { a: 'ø' });
// Browsers encode the checkmark as ✓ when submitting as iso-8859-1:
var detectedAsIso8859_1 = qs.parse('utf8=%26%2310003%3B&a=%F8', {
charset: 'utf-8',
charsetSentinel: true
});
assert.deepEqual(detectedAsIso8859_1, { a: 'ø' });
If you want to decode the &#...; syntax to the actual character, you can specify the interpretNumericEntities option as well:
var detectedAsIso8859_1 = qs.parse('a=%26%239786%3B', {
charset: 'iso-8859-1',
interpretNumericEntities: true
});
assert.deepEqual(detectedAsIso8859_1, { a: '☺' });
It also works when the charset has been detected in charsetSentinel mode.
qs can also parse arrays using a similar [] notation:
var withArray = qs.parse('a[]=b&a[]=c');
assert.deepEqual(withArray, { a: ['b', 'c'] });
You may specify an index as well:
var withIndexes = qs.parse('a[1]=c&a[0]=b');
assert.deepEqual(withIndexes, { a: ['b', 'c'] });
Note that the only difference between an index in an array and a key in an object is that the value between the brackets must be a number to create an array. When creating arrays with specific indices, qs will compact a sparse array to only the existing values preserving their order:
var noSparse = qs.parse('a[1]=b&a[15]=c');
assert.deepEqual(noSparse, { a: ['b', 'c'] });
You may also use allowSparse option to parse sparse arrays:
var sparseArray = qs.parse('a[1]=2&a[3]=5', { allowSparse: true });
assert.deepEqual(sparseArray, { a: [, '2', , '5'] });
Note that an empty string is also a value, and will be preserved:
var withEmptyString = qs.parse('a[]=&a[]=b');
assert.deepEqual(withEmptyString, { a: ['', 'b'] });
var withIndexedEmptyString = qs.parse('a[0]=b&a[1]=&a[2]=c');
assert.deepEqual(withIndexedEmptyString, { a: ['b', '', 'c'] });
qs will also limit arrays to a maximum of 20 elements.
Any array members with an index of 20 or greater will instead be converted to an object with the index as the key.
This is needed to handle cases when someone sent, for example, a[999999999] and it will take significant time to iterate over this huge array.
var withMaxIndex = qs.parse('a[100]=b');
assert.deepEqual(withMaxIndex, { a: { '100': 'b' } });
This limit can be overridden by passing an arrayLimit option:
var withArrayLimit = qs.parse('a[1]=b', { arrayLimit: 0 });
assert.deepEqual(withArrayLimit, { a: { '1': 'b' } });
If you want to throw an error whenever the array limit is exceeded, set the throwOnLimitExceeded option to true. This option will generate a descriptive error if the query string exceeds a configured limit.
try {
qs.parse('a[1]=b', { arrayLimit: 0, throwOnLimitExceeded: true });
} catch (err) {
assert(err instanceof Error);
assert.strictEqual(err.message, 'Array limit exceeded. Only 0 elements allowed in an array.');
}
When throwOnLimitExceeded is set to false (default), qs will parse up to the specified arrayLimit and if the limit is exceeded, the array will instead be converted to an object with the index as the key
To prevent array syntax (a[], a[0]) from being parsed as arrays, set parseArrays to false.
Note that duplicate keys (e.g. a=b&a=c) may still produce arrays when duplicates is 'combine' (the default).
var noParsingArrays = qs.parse('a[]=b', { parseArrays: false });
assert.deepEqual(noParsingArrays, { a: { '0': 'b' } });
If you mix notations, qs will merge the two items into an object:
var mixedNotation = qs.parse('a[0]=b&a[b]=c');
assert.deepEqual(mixedNotation, { a: { '0': 'b', b: 'c' } });
When a key appears as both a plain value and an object, qs will by default wrap the conflicting values in an array (strictMerge defaults to true):
assert.deepEqual(qs.parse('a[b]=c&a=d'), { a: [{ b: 'c' }, 'd'] });
assert.deepEqual(qs.parse('a=d&a[b]=c'), { a: ['d', { b: 'c' }] });
To restore the legacy behavior (where the primitive is used as a key with value true), set strictMerge to false:
assert.deepEqual(qs.parse('a[b]=c&a=d', { strictMerge: false }), { a: { b: 'c', d: true } });
You can also create arrays of objects:
var arraysOfObjects = qs.parse('a[][b]=c');
assert.deepEqual(arraysOfObjects, { a: [{ b: 'c' }] });
Some people use comma to join array, qs can parse it:
var arraysOfObjects = qs.parse('a=b,c', { comma: true })
assert.deepEqual(arraysOfObjects, { a: ['b', 'c'] })
(this cannot convert nested objects, such as a={b:1},{c:d})
By default, all values are parsed as strings. This behavior will not change and is explained in issue #91.
var primitiveValues = qs.parse('a=15&b=true&c=null');
assert.deepEqual(primitiveValues, { a: '15', b: 'true', c: 'null' });
If you wish to auto-convert values which look like numbers, booleans, and other values into their primitive counterparts, you can use the query-types Express JS middleware which will auto-convert all request query parameters.
qs.stringify(object, [options]);
When stringifying, qs by default URI encodes output. Objects are stringified as you would expect:
assert.equal(qs.stringify({ a: 'b' }), 'a=b');
assert.equal(qs.stringify({ a: { b: 'c' } }), 'a%5Bb%5D=c');
This encoding can be disabled by setting the encode option to false:
var unencoded = qs.stringify({ a: { b: 'c' } }, { encode: false });
assert.equal(unencoded, 'a[b]=c');
Encoding can be disabled for keys by setting the encodeValuesOnly option to true:
var encodedValues = qs.stringify(
{ a: 'b', c: ['d', 'e=f'], f: [['g'], ['h']] },
{ encodeValuesOnly: true }
);
assert.equal(encodedValues,'a=b&c[0]=d&c[1]=e%3Df&f[0][0]=g&f[1][0]=h');
This encoding can also be replaced by a custom encoding method set as encoder option:
var encoded = qs.stringify({ a: { b: 'c' } }, { encoder: function (str) {
// Passed in values `a`, `b`, `c`
return // Return encoded string
}})
(Note: the encoder option does not apply if encode is false)
Analogue to the encoder there is a decoder option for parse to override decoding of properties and values:
var decoded = qs.parse('x=z', { decoder: function (str) {
// Passed in values `x`, `z`
return // Return decoded string
}})
You can encode keys and values using different logic by using the type argument provided to the encoder:
var encoded = qs.stringify({ a: { b: 'c' } }, { encoder: function (str, defaultEncoder, charset, type) {
if (type === 'key') {
return // Encoded key
} else if (type === 'value') {
return // Encoded value
}
}})
The type argument is also provided to the decoder:
var decoded = qs.parse('x=z', { decoder: function (str, defaultDecoder, charset, type) {
if (type === 'key') {
return // Decoded key
} else if (type === 'value') {
return // Decoded value
}
}})
Examples beyond this point will be shown as though the output is not URI encoded for clarity. Please note that the return values in these cases will be URI encoded during real usage.
When arrays are stringified, they follow the arrayFormat option, which defaults to indices:
qs.stringify({ a: ['b', 'c', 'd'] });
// 'a[0]=b&a[1]=c&a[2]=d'
You may override this by setting the indices option to false, or to be more explicit, the arrayFormat option to repeat:
qs.stringify({ a: ['b', 'c', 'd'] }, { indices: false });
// 'a=b&a=c&a=d'
You may use the arrayFormat option to specify the format of the output array:
qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'indices' })
// 'a[0]=b&a[1]=c'
qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'brackets' })
// 'a[]=b&a[]=c'
qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'repeat' })
// 'a=b&a=c'
qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'comma' })
// 'a=b,c'
Note: when using arrayFormat set to 'comma', you can also pass the commaRoundTrip option set to true or false, to append [] on single-item arrays, so that they can round trip through a parse.
When objects are stringified, by default they use bracket notation:
qs.stringify({ a: { b: { c: 'd', e: 'f' } } });
// 'a[b][c]=d&a[b][e]=f'
You may override this to use dot notation by setting the allowDots option to true:
qs.stringify({ a: { b: { c: 'd', e: 'f' } } }, { allowDots: true });
// 'a.b.c=d&a.b.e=f'
You may encode the dot notation in the keys of object with option encodeDotInKeys by setting it to true:
Note: it implies allowDots, so stringify will error if you set decodeDotInKeys to true, and allowDots to false.
Caveat: when encodeValuesOnly is true as well as encodeDotInKeys, only dots in keys and nothing else will be encoded.
qs.stringify({ "name.obj": { "first": "John", "last": "Doe" } }, { allowDots: true, encodeDotInKeys: true })
// 'name%252Eobj.first=John&name%252Eobj.last=Doe'
You may allow empty array values by setting the allowEmptyArrays option to true:
qs.stringify({ foo: [], bar: 'baz' }, { allowEmptyArrays: true });
// 'foo[]&bar=baz'
Empty strings and null values will omit the value, but the equals sign (=) remains in place:
assert.equal(qs.stringify({ a: '' }), 'a=');
Key with no values (such as an empty object or array) will return nothing:
assert.equal(qs.stringify({ a: [] }), '');
assert.equal(qs.stringify({ a: {} }), '');
assert.equal(qs.stringify({ a: [{}] }), '');
assert.equal(qs.stringify({ a: { b: []} }), '');
assert.equal(qs.stringify({ a: { b: {}} }), '');
Properties that are set to undefined will be omitted entirely:
assert.equal(qs.stringify({ a: null, b: undefined }), 'a=');
The query string may optionally be prepended with a question mark:
assert.equal(qs.stringify({ a: 'b', c: 'd' }, { addQueryPrefix: true }), '?a=b&c=d');
Note that when the output is an empty string, the prefix will not be added:
assert.equal(qs.stringify({}, { addQueryPrefix: true }), '');
The delimiter may be overridden with stringify as well:
assert.equal(qs.stringify({ a: 'b', c: 'd' }, { delimiter: ';' }), 'a=b;c=d');
If you only want to override the serialization of Date objects, you can provide a serializeDate option:
var date = new Date(7);
assert.equal(qs.stringify({ a: date }), 'a=1970-01-01T00:00:00.007Z'.replace(/:/g, '%3A'));
assert.equal(
qs.stringify({ a: date }, { serializeDate: function (d) { return d.getTime(); } }),
'a=7'
);
You may use the sort option to affect the order of parameter keys:
function alphabeticalSort(a, b) {
return a.localeCompare(b);
}
assert.equal(qs.stringify({ a: 'c', z: 'y', b : 'f' }, { sort: alphabeticalSort }), 'a=c&b=f&z=y');
Finally, you can use the filter option to restrict which keys will be included in the stringified output.
If you pass a function, it will be called for each key to obtain the replacement value.
Otherwise, if you pass an array, it will be used to select properties and array indices for stringification:
function filterFunc(prefix, value) {
if (prefix == 'b') {
// Return an `undefined` value to omit a property.
return;
}
if (prefix == 'e[f]') {
return value.getTime();
}
if (prefix == 'e[g][0]') {
return value * 2;
}
return value;
}
qs.stringify({ a: 'b', c: 'd', e: { f: new Date(123), g: [2] } }, { filter: filterFunc });
// 'a=b&c=d&e[f]=123&e[g][0]=4'
qs.stringify({ a: 'b', c: 'd', e: 'f' }, { filter: ['a', 'e'] });
// 'a=b&e=f'
qs.stringify({ a: ['b', 'c', 'd'], e: 'f' }, { filter: ['a', 0, 2] });
// 'a[0]=b&a[2]=d'
You could also use filter to inject custom serialization for user defined types.
Consider you're working with some api that expects query strings of the format for ranges:
https://domain.com/endpoint?range=30...70
For which you model as:
class Range {
constructor(from, to) {
this.from = from;
this.to = to;
}
}
You could inject a custom serializer to handle values of this type:
qs.stringify(
{
range: new Range(30, 70),
},
{
filter: (prefix, value) => {
if (value instanceof Range) {
return `${value.from}...${value.to}`;
}
// serialize the usual way
return value;
},
}
);
// range=30...70
null valuesBy default, null values are treated like empty strings:
var withNull = qs.stringify({ a: null, b: '' });
assert.equal(withNull, 'a=&b=');
Parsing does not distinguish between parameters with and without equal signs. Both are converted to empty strings.
var equalsInsensitive = qs.parse('a&b=');
assert.deepEqual(equalsInsensitive, { a: '', b: '' });
To distinguish between null values and empty strings use the strictNullHandling flag. In the result string the null
values have no = sign:
var strictNull = qs.stringify({ a: null, b: '' }, { strictNullHandling: true });
assert.equal(strictNull, 'a&b=');
To parse values without = back to null use the strictNullHandling flag:
var parsedStrictNull = qs.parse('a&b=', { strictNullHandling: true });
assert.deepEqual(parsedStrictNull, { a: null, b: '' });
To completely skip rendering keys with null values, use the skipNulls flag:
var nullsSkipped = qs.stringify({ a: 'b', c: null}, { skipNulls: true });
assert.equal(nullsSkipped, 'a=b');
If you're communicating with legacy systems, you can switch to iso-8859-1 using the charset option:
var iso = qs.stringify({ æ: 'æ' }, { charset: 'iso-8859-1' });
assert.equal(iso, '%E6=%E6');
Characters that don't exist in iso-8859-1 will be converted to numeric entities, similar to what browsers do:
var numeric = qs.stringify({ a: '☺' }, { charset: 'iso-8859-1' });
assert.equal(numeric, 'a=%26%239786%3B');
You can use the charsetSentinel option to announce the character by including an utf8=✓ parameter with the proper encoding if the checkmark, similar to what Ruby on Rails and others do when submitting forms.
var sentinel = qs.stringify({ a: '☺' }, { charsetSentinel: true });
assert.equal(sentinel, 'utf8=%E2%9C%93&a=%E2%98%BA');
var isoSentinel = qs.stringify({ a: 'æ' }, { charsetSentinel: true, charset: 'iso-8859-1' });
assert.equal(isoSentinel, 'utf8=%26%2310003%3B&a=%E6');
By default the encoding and decoding of characters is done in utf-8, and iso-8859-1 support is also built in via the charset parameter.
If you wish to encode querystrings to a different character set (i.e.
Shift JIS) you can use the
qs-iconv library:
var encoder = require('qs-iconv/encoder')('shift_jis');
var shiftJISEncoded = qs.stringify({ a: 'こんにちは!' }, { encoder: encoder });
assert.equal(shiftJISEncoded, 'a=%82%B1%82%F1%82%C9%82%BF%82%CD%81I');
This also works for decoding of query strings:
var decoder = require('qs-iconv/decoder')('shift_jis');
var obj = qs.parse('a=%82%B1%82%F1%82%C9%82%BF%82%CD%81I', { decoder: decoder });
assert.deepEqual(obj, { a: 'こんにちは!' });
RFC3986 used as default option and encodes ' ' to %20 which is backward compatible. In the same time, output can be stringified as per RFC1738 with ' ' equal to '+'.
assert.equal(qs.stringify({ a: 'b c' }), 'a=b%20c');
assert.equal(qs.stringify({ a: 'b c' }, { format : 'RFC3986' }), 'a=b%20c');
assert.equal(qs.stringify({ a: 'b c' }, { format : 'RFC1738' }), 'a=b+c');
Please email @ljharb or see https://tidelift.com/security if you have a potential security vulnerability to report.
Available as part of the Tidelift Subscription
The maintainers of qs and thousands of other packages are working with Tidelift to deliver commercial support and maintenance for the open source dependencies you use to build your applications. Save time, reduce risk, and improve code health, while paying the maintainers of the exact dependencies you use. Learn more.
qs logo by NUMI: