URL Encode Curly Braces ({ })
Learn how to URL encode curly braces { and } as %7B and %7D. Important for passing JSON data, template variables, and API filter syntax.
Character
{}
Encoded
%7B%7D
Detailed Explanation
Curly braces ({ and }) are not explicitly reserved by RFC 3986, but they are classified as "unsafe" characters that should always be encoded in URLs. Their percent-encoded forms are %7B and %7D.
Percent-encoded forms:
{encodes to%7B(ASCII code 123, hexadecimal 0x7B)}encodes to%7D(ASCII code 125, hexadecimal 0x7D)
Why they must be encoded: Although curly braces have no defined structural role in URIs, RFC 3986 explicitly excludes them from the set of characters that may appear unencoded. Many URL parsers, validators, and security tools reject or mishandle URLs containing bare curly braces. Browsers typically encode them automatically in the address bar, but programmatic HTTP clients may not.
JavaScript behavior:
encodeURIComponent("{"key":"value"}") // "%7B%22key%22%3A%22value%22%7D"
encodeURI("{test}") // "%7Btest%7D"
// Both encodeURI and encodeURIComponent encode curly braces
Common scenarios:
- Passing JSON data in query parameters:
?filter=%7B%22status%22%3A%22active%22%7D - URI templates (RFC 6570) use curly braces as template syntax:
/users/{userId}/posts/{postId} - GraphQL queries passed as GET parameters
- Elasticsearch queries in URL parameters
- Mustache or Handlebars template strings in URL parameters
URI Templates vs. URL encoding: RFC 6570 defines URI Templates that use curly braces as variable placeholders. These are template strings, not actual URLs. The braces are expanded (replaced with actual values) before the resulting URL is used. Do not encode the braces in a URI template itself; only encode them when curly braces appear as literal data in a finalized URL.
Pitfall: Passing JSON directly in URL query parameters (even when properly encoded) creates very long URLs that may exceed browser or server limits (commonly 2,048 to 8,192 characters). For complex data structures, consider using POST requests with a JSON body instead. If you must use GET, base64-encode the JSON first, which often produces shorter encoded strings than percent-encoding the JSON directly.
Use Case
Passing JSON filter objects as URL query parameters in REST API requests, such as Elasticsearch queries or complex API filter syntax.