How to parse a URL

Somewhere in your logs there’s a URL that’s 600 characters long, half of it %2F and %3D, and you need to know which campaign it came from. Reading it by eye works about as well as you’d expect. Breaking it into parts takes seconds.

The anatomy of a URL

A URL (Uniform Resource Locator) has a structure defined by RFC 3986. Knowing the parts helps when you build API requests, read logs or debug redirects. Take this URL:

https://user:pass@shop.example.com:8080/api/v1/orders?city=Lisbon&sort=newest#latest

The scheme says how to talk to the server, usually https or http. The host names the server, and the optional port overrides the default (443 for HTTPS, 80 for HTTP). The path identifies the resource and the query string passes key-value parameters. The fragment points to a part of the page and is never sent to the server. User info is rarely used today, and browsers discourage putting credentials in URLs.

URL encoding and decoding

A URL can only contain a limited set of ASCII characters. Anything else, such as spaces, non-Latin letters, or characters with a special meaning like & inside a value, must be percent-encoded: a space becomes %20 and an ampersand becomes %26.

https://example.com/search?q=pastel de nata&lang=pt

https://example.com/search?q=pastel%20de%20nata&lang=pt

In query strings sent by HTML forms, a space is often written as + instead of %20. Decoding reverses the process and turns the percent codes back into readable text. That matters for URLs copied from logs, analytics tools and redirect chains, where a URL can be encoded inside another URL.

Query parameters

Query parameters are the key=value pairs after the ?, separated by &. Search, pagination, API filters and tracking all rely on them:

https://api.example.com/products?category=headphones&min_price=50&max_price=300&sort=price_asc&page=2

A key can appear more than once, as in ?tag=a&tag=b, and many servers read that as a list.

How to use the URL parser

1. Open the URL parser, paste a full URL including its scheme, such as https://, and select Parse or press Enter.
2. A table shows the protocol, origin, host, hostname, port, pathname, search and hash. A port shows as (default) when the URL doesn’t set one.
3. If the URL has a query string, a second table lists each parameter with its key and decoded value, including repeated keys.

Below the parser are two smaller tools. URL encode percent-encodes a string so it’s safe to use as a parameter value, and URL decode turns an encoded string back into text. Both have a Copy button. Everything runs in your browser using its built-in URL parser.

Common uses

Debugging API requests

When an API returns something unexpected, check the URL first. A missing & or a pagesize that should have been page_size explains more bugs than anyone would like. Paste the request URL into the parser to see every parameter on its own line.

Reading tracking and redirect URLs

Marketing links often carry the destination URL as an encoded parameter, sometimes encoded more than once. Parse the link to find the parameter, then paste its value into URL decode. Decode again if the result still contains percent codes.

Checking URLs you build in code

Concatenating strings to build URLs makes encoding mistakes easy. Paste the generated URL into the parser to confirm the parameters come out as you intended.

Parsing URLs in JavaScript

Browsers and Node.js include the URL class for parsing, and URLSearchParams for reading and building query strings:

const url = new URL("https://example.com/path?key=value#section");

url.hostname; // "example.com"
url.pathname; // "/path"
url.searchParams.get("key"); // "value"
url.hash; // "#section"

// Build a query string with correct encoding
const params = new URLSearchParams({ q: "pastel de nata", lang: "pt" });
params.toString(); // "q=pastel+de+nata&lang=pt"

To encode a single value yourself, use encodeURIComponent, which is what the URL encode tool uses. new URL() throws an error for a string without a scheme, so wrap it in try/catch when parsing user input.