About the URL Parser
This URL parser breaks a web address into its components exactly as a browser sees it: scheme (protocol), username and password, host name, port, path, query string and fragment (hash). Every query parameter is listed in a table with its decoded value — so %20, + and %C3%A9 become readable text — and repeated keys such as tag=a&tag=b are shown individually.
It is useful for debugging redirects and OAuth callbacks, checking UTM tracking parameters on marketing links, inspecting API requests copied from DevTools, and teaching how URLs are structured. It also reports the origin used by CORS and cookies, the effective port when none is written, and converts international domain names to the punycode form DNS uses.
Parsing follows the WHATWG URL Standard implemented by every modern browser and Node.js, so results match new URL() in JavaScript. Relative links such as /docs?page=2 can be resolved against a base URL. Nothing is fetched — the link is only analysed in your browser.
How to use the url parser
- 1Paste the full URL, including https://.
- 2For a relative link, enter the page’s base URL as well.
- 3Read the host, port, path, query and fragment in the results.
- 4Check the query parameter table for decoded values and repeated keys.
- 5Copy the normalised URL or the JSON breakdown.
Formula and method
A URL is split according to the WHATWG URL Standard: the scheme ends at the first colon, an authority section (credentials, host and port) follows //, the path runs until ? or #, the query runs from ? to #, and the fragment is everything after #. The parser lowercases the scheme and host, converts international domain names to punycode, resolves . and .. path segments, percent-encodes characters that are not allowed, and drops a port that equals the scheme’s default.
Query parameters are split on & and then on the first =; keys and values are percent-decoded and + is read as a space, as in HTML form encoding. The origin is scheme + host + port, which browsers use for the same-origin policy and CORS. With a base URL, relative references are resolved the way a link on that page would be.
- scheme
- Protocol such as https, ftp or mailto
- host
- Domain name or IP address
- query
- key=value pairs separated by &
- fragment
- In-page anchor, never sent to the server
Worked examples
Shop URL with credentials, port and repeated parameters
The scheme is https and the explicit port 8080 replaces the default 443, so the origin includes :8080. The query has four parameters — tag appears twice, and its first value decodes from a%20b to "a b". The fragment #reviews stays in the browser and is never sent to the server.
Marketing link with UTM tags and default port
Scheme and host are case-insensitive, so they are normalised to lowercase. No port is written, so https’s default 443 applies. Three UTM parameters are found; "fall+sale" decodes to "fall sale" because + means a space in query strings.
Relative link resolved against a base URL
From the page /docs/guide/, the ../ segment steps up one directory to /docs/, so the link resolves to /docs/api/v2/users with one query parameter, id=7.
International domain name
DNS only carries ASCII, so the IDNA rules convert münchen.de to its punycode form xn--mnchen-3ya.de, which is what the browser actually looks up.
Frequently asked questions
What are the parts of a URL?+
A URL has a scheme (https), optional credentials (user:password@), a host (example.com), an optional port (:8080), a path (/products/shoes), an optional query string (?color=red&size=10) and an optional fragment (#reviews).
What is the difference between a URL’s host and origin?+
The host is the domain name or IP address, optionally with a port. The origin combines scheme, host and port (https://example.com:443). Browsers use the origin for the same-origin policy, CORS and storage isolation.
Is the URL fragment sent to the server?+
No. Everything after # is handled by the browser — it scrolls to an anchor or is read by JavaScript — and is never included in the HTTP request. That is why single-page apps and OAuth implicit flows use it.
Why does + become a space in query parameters?+
HTML forms encode spaces as + in the application/x-www-form-urlencoded format, and most servers decode it that way. In the path, + is a literal plus sign; %20 is the unambiguous encoding of a space anywhere.
How do I get query parameters from a URL in JavaScript?+
Use new URL(link).searchParams: searchParams.get("color") returns the first value and searchParams.getAll("tag") returns every value for a repeated key. In Python use urllib.parse.urlparse with parse_qs.