How to URL Encode JSON
Part of the Encoding ToolkitencodeURIComponent(JSON.stringify(value))decode with JSON.parse(params.get(key)) — URLSearchParams already decodes once
Explanation
Serialize the object with JSON.stringify, then percent-encode the entire resulting string as one value — not each field separately. The whole thing goes into a single query parameter.
On the way back out, URLSearchParams (and most server-side query parsers) already decode the value once — you only need JSON.parse, not decodeURIComponent first.
This roughly doubles the size of the JSON for the escaping alone, so it's worth it mainly when the shape genuinely doesn't flatten into ordinary query parameters — see How to URL Encode JSON for the full size-cost comparison and when to flatten instead.
Valid examples
?filter=%7B%22status%22%3A%22active%22%2C%22tags%22%3A%5B%22js%22%2C%22css%22%5D%2C%22page%22%3A1%7D{"status":"active","tags":["js","css"],"page":1} — JSON.stringify then encodeURIComponent, as one value.
JSON.parse(params.get("filter"))Decoding it back — URLSearchParams already decoded the value once, so JSON.parse alone is correct.
Invalid examples
?filter={"status":"active"}Raw, unencoded JSON in a URL — breaks the moment the JSON contains &, =, #, or a space.
JSON.parse(decodeURIComponent(params.get("filter")))Decoding twice — URLSearchParams already decoded it once; a second decodeURIComponent corrupts any value that happens to contain a %XX-looking sequence.
?status=active&tags=%5B%22js%22...Encoding each field separately instead of the whole serialized string — doesn't reconstruct as valid JSON on the other end.