Why does JSON need URL encoding?

URLs reserve certain characters, like {, }, ", and &, for their own syntax. JSON uses several of those characters constantly, so passing raw JSON in a query string would break the URL's structure. Percent-encoding replaces each reserved character with a safe %XX sequence.

Should I use this or Base64 for a query parameter?

Either works, but they trade off differently: URL-encoded JSON stays somewhat human-readable in the address bar and is shorter for simple documents, while Base64 is more compact for JSON with lots of quotes and braces and avoids any ambiguity with the & and = characters URLs already use as delimiters.

Does this validate my JSON first?

Yes, the input is parsed before encoding, so you get a JSON error immediately rather than a successfully encoded but invalid document.

How do I reverse this?

Use the URL-decode JSON tool, which decodes the percent-encoding and validates the result as JSON.

JSON URL Encoder Online - Percent-Encode JSON

Overview

Introduction

Passing a JSON document as part of a URL, in a query parameter carrying filter criteria or initial application state, requires escaping every character the URL syntax itself reserves. Doing that by hand for a whole JSON object is tedious and error-prone.

This tool validates your JSON and percent-encodes it in one step, producing a value that's safe to append to a query string.

What Is JSON URL Encoder?

A URL encoder scoped to JSON: it first confirms the input is valid JSON, then applies percent-encoding using the same rules as JavaScript's encodeURIComponent().

Reserved characters like {, }, ", :, and space are replaced with their %XX hexadecimal byte representation, leaving unreserved characters (letters, digits, and a small set of punctuation) untouched.

How JSON URL Encoder Works

After parsing the input to confirm it's valid JSON, the tool passes the raw text to encodeURIComponent(), which percent-encodes every character outside the unreserved URI character set.

This is the same encoding a browser applies automatically when you set a query parameter via the URLSearchParams API, so the result is guaranteed to be URL-safe.

When To Use JSON URL Encoder

Use it when building a shareable link that encodes application state, filters, or a small config as JSON in the query string.

It's also useful when manually testing an API endpoint that expects a JSON-shaped query parameter.

Often used alongside JSON URL Decoder, JSON to Base64 Converter and JSON Formatter & Beautifier.

Features

Advantages

Validates the JSON before encoding, catching malformed input early.
Matches the browser's own encodeURIComponent() behavior exactly.
Produces output safe to concatenate directly into a query string.

Limitations

Percent-encoded JSON is significantly longer than the original, which can bump into URL length limits for large documents.
Doesn't encode the entire URL, only the JSON value itself; surrounding URL structure is your responsibility.

Examples

Encoding a filter object

Input

{"status":"active","limit":10}

Output

%7B%22status%22%3A%22active%22%2C%22limit%22%3A10%7D

Braces, quotes, colons, and commas are all percent-encoded since they're reserved in URLs.

Best Practices & Notes

Best Practices

For large JSON payloads, consider Base64 encoding instead, or better, POSTing the data rather than putting it in a URL.
Always decode and re-validate the parameter on the receiving end rather than trusting it blindly.
Keep query-string JSON small; deeply nested structures make for unreadable, unwieldy URLs.

Developer Notes

The encoding step is a direct call to encodeURIComponent(input) after a JSON.parse() validation pass; encodeURIComponent is used rather than the looser encodeURI() because JSON's structural characters ({, }, ", :) are exactly the reserved characters encodeURIComponent is designed to escape, while encodeURI() would leave several of them untouched.

JSON URL Encoder Use Cases

Encoding filter or sort state into a shareable URL's query string
Testing an API endpoint that expects a JSON query parameter
Passing a small config object between pages via the URL

Common Mistakes

Encoding an entire URL with this tool instead of just the JSON value portion.
Assuming URL encoding provides security; it's purely a character-safety transformation.
Using this for large JSON payloads that would be better sent in a request body.

Tips

If the resulting URL feels too long, switch to Base64 encoding or move the data into a POST body instead.
Test the encoded URL in an actual browser address bar to confirm nothing gets double-encoded downstream.

JSON URL Encoder