Query String Parser & Builder — Decode URL Parameters Instantly

That 500-character URL with encoded parameters? Parse it into readable key-value pairs in one click.

What Is a Query String?

A query string is the part of a URL that comes after the ? character. It contains key-value pairs separated by &, with each key and value joined by =:

https://example.com/search?q=javascript&sort=date&page=2&lang=en
                           └──────────── query string ──────────┘

Parsed into key-value pairs:

q    = javascript
sort = date
page = 2
lang = en

Simple enough for four parameters. But real-world URLs from analytics platforms, ad networks, OAuth flows, and API callbacks can have dozens of encoded parameters that are nearly impossible to read without a parser.

Real-World Query String Complexity

Here's what a Google Analytics tracking URL actually looks like:

https://example.com/landing?utm_source=google&utm_medium=cpc&utm_campaign=spring_sale_2026&utm_content=banner_v2&utm_term=developer%20tools%20online&gclid=CjwKCAiA-P-rBhBEEiwAQEXhH8Z7YqKxN&fbclid=IwAR3x_7qK2m&ref=newsletter_feb&discount=SAVE20&redirect_url=https%3A%2F%2Fexample.com%2Fdashboard%3Ftab%3Doverview%26view%3Dmonthly

Try reading that. Now paste it into our URL parser and instantly see every parameter decoded and organized. The redirect_url parameter alone contains an encoded URL with its own query parameters — a URL within a URL.

Anatomy of Query String Syntax

Basic Structure

?key1=value1&key2=value2&key3=value3

Special Cases

Keys without values:

?debug&verbose&key=value
// debug = "" (empty), verbose = "" (empty), key = "value"

Multiple values for the same key:

?color=red&color=blue&color=green
// color = ["red", "blue", "green"] (in most frameworks)

Array notation (PHP/Rails convention):

?colors[]=red&colors[]=blue&colors[]=green
?user[name]=Alice&user[age]=30

Encoded values containing special characters:

?q=fish%20%26%20chips&url=https%3A%2F%2Fexample.com
// q = "fish & chips", url = "https://example.com"

Parsing Query Strings in Code

JavaScript (Browser)

// Modern approach — URLSearchParams
const url = new URL('https://example.com?q=hello&page=2');
const params = url.searchParams;

params.get('q');      // "hello"
params.get('page');   // "2"
params.has('q');      // true

// Iterate all parameters
for (const [key, value] of params) {
  console.log(`${key}: ${value}`);
}

// Build query strings
const search = new URLSearchParams();
search.set('q', 'fish & chips');
search.set('page', '1');
search.toString(); // "q=fish+%26+chips&page=1"

Python

from urllib.parse import urlparse, parse_qs, urlencode

# Parse
url = urlparse('https://example.com?q=hello&page=2')
params = parse_qs(url.query)
# {'q': ['hello'], 'page': ['2']}

# Build
urlencode({'q': 'fish & chips', 'page': 1})
# 'q=fish+%26+chips&page=1'

PHP

// Parse
parse_str('q=hello&page=2', $params);
// $params = ['q' => 'hello', 'page' => '2']

// Build
http_build_query(['q' => 'fish & chips', 'page' => 1]);
// 'q=fish+%26+chips&page=1'

Common Debugging Scenarios

OAuth Callback URLs

OAuth redirects pack a lot of information into the callback URL: authorization codes, state tokens, scopes, and error descriptions. When something goes wrong, parsing the callback URL is the first debugging step.

https://yourapp.com/callback?code=abc123&state=xyz789&scope=read%20write%20profile

Webhook Payloads

Many webhook services send data as URL-encoded form data. Decoding the query string reveals the payload structure:

event=payment.completed&data[id]=pay_123&data[amount]=4999&data[currency]=usd

Analytics and Tracking

Marketing URLs accumulate tracking parameters from multiple sources. Parsing helps you understand which campaign, source, and medium drove each visit — essential for debugging attribution.

API Error Responses

Some APIs return error details in redirect URLs:

https://yourapp.com/error?code=403&message=Insufficient%20permissions&required_scope=admin%3Awrite

Building Clean URLs

When constructing URLs programmatically, follow these best practices:

1. Always use URL builder APIs instead of string concatenation. URLSearchParams in JavaScript, urlencode() in Python — they handle encoding correctly.
2. Don't manually encode: Let the API do it. Manual encoding leads to double-encoding bugs.
3. Sort parameters deterministically: For caching and comparison, sort query parameters alphabetically.
4. Remove empty parameters: ?q=&page=1 is cleaner as ?page=1.
5. Use appropriate encoding: + for spaces is valid in query strings but %20 is safer and more portable.

Query Strings vs. Fragment Identifiers

Don't confuse query strings (?) with fragments (#):

https://example.com/page?key=value#section
                         ↑ query     ↑ fragment

• Query strings are sent to the server — the server sees and processes them
• Fragments stay in the browser — the server never sees them

This distinction matters for single-page applications (SPAs) that use fragment-based routing, and for OAuth implementations that return tokens in fragments for security (implicit flow).

Query String Length Limits

While there's no hard limit in the HTTP specification, practical limits exist:

• Browsers: Most support URLs up to ~2,000-8,000 characters
• Web servers: Apache defaults to 8,190 bytes; Nginx defaults to 8KB for the entire request line
• CDNs and proxies: May impose their own limits

If your query string approaches these limits, consider using POST requests with a request body instead.