URL Parser

A url parser takes a URL string and breaks it into its constituent parts: the scheme (or protocol), the host, the port, the path, the query string parameters, and the fragment. URLs are defined in RFC 3986, and the parser follows that grammar plus the browser-aligned WHATWG URL Standard, which is what JavaScript’s URL constructor implements.

This URL Parser accepts any absolute URL, validates it with the same parser the browser uses, and surfaces the protocol, hostname, port, pathname, hash, full URL, and a table of decoded query parameters. Backend developers, QA engineers, and integration teams use a url parser to debug OAuth callback URLs, to confirm how a query string was encoded, to spot accidentally double-encoded values, and to extract a single parameter without running a string split by hand.

Why use a URL Parser?

• Decode query parameters precisely. The parser uses URLSearchParams so percent-encoded values like %20 and %2F resolve correctly.
• Verify OAuth and redirect URLs. Confirm redirect_uri carries the exact scheme, host, and path your auth server expects.
• Catch malformed URLs early. The browser’s parser rejects inputs missing a scheme or with invalid characters and surfaces the error.
• Inspect deep links and tracking pixels. Paste a marketing link to see which UTM parameters it carries.

How to use the URL Parser

1. Paste a URL into the URL input, for example https://example.com/path?key=value#hash.
2. The parser validates and decomposes the URL live as you type.
3. Read the table of parsed parts: Protocol, Hostname, Port, Pathname, Hash, and Full URL.
4. Scroll the Query Parameters section to see each key=value pair, decoded once.
5. Copy individual values with the inline copy buttons, or copy the rebuilt URL from the Query Parameters header.

URL anatomy

Every absolute URL follows the same skeleton, defined by RFC 3986. The parser extracts each labeled part.

https://user:pass@example.com:8443/path/to/page?key=value&foo=bar#section-2
└─┬─┘   └────┬───┘ └────┬────┘ └┬┘ └─────┬─────┘ └───────┬───────┘ └───┬───┘
  │         │           │       │        │              │             │
scheme  userinfo      host    port     path           query         fragment

The browser-aligned WHATWG URL Standard collapses some of these into properties:

The parser drops userinfo from the surfaced fields because most real-world URLs no longer carry credentials inline (it was deprecated for security in 2017), but the underlying URL object preserves it if you need it.

Parsed-output example

Take this URL:

https://api.example.com:8443/v1/users?role=admin&active=true#row-42

The parser produces the following structured output:

{
  "protocol": "https:",
  "hostname": "api.example.com",
  "port": "8443",
  "pathname": "/v1/users",
  "hash": "#row-42",
  "params": {
    "role": "admin",
    "active": "true"
  }
}

Notice that protocol retains the trailing colon (this matches the WHATWG standard), and port is a string because it can be empty when the URL uses the default port for the scheme.

Common use cases

• Backend developers debugging OAuth flows. Confirm that the code and state parameters arrive exactly as the auth server sent them, with no missing percent-encoding.
• QA engineers reproducing routing bugs. Spot whether a SPA route is in pathname or hash, which determines whether the server sees it at all.
• Marketing operations validating campaign URLs. Paste a tracking URL to verify UTM parameters parse cleanly before sending to thousands of recipients.
• API integration teams writing webhook handlers. Inspect signed-redirect URLs to confirm the query string includes the expected signature parameter.
• Security engineers reviewing redirect chains. Decompose each URL in a redirect chain to spot open-redirect vulnerabilities where redirect_to= points outside your origin.

Frequently asked questions

What is a URL parser?

A URL parser breaks a URL string into structured parts: scheme, host, port, path, query, and fragment. Browsers ship a built-in parser via the URL constructor.

What is the difference between URL and URI?

URI is the broader category defined in RFC 3986. URL is a subset that identifies a resource by location. Every URL is a URI; not every URI is a URL.

How do I parse query string parameters?

Use the URLSearchParams API: new URL(input).searchParams.get("key"). The parser handles percent-decoding and preserves repeated keys (?tag=a&tag=b).

What is the difference between hash and query?

The query string (?key=value) is sent to the server as part of the HTTP request. The hash fragment (#section) stays in the browser and is never sent to the server. Single-page apps often store route state in the hash to avoid round trips.

Why does the parser reject some URLs?

The WHATWG parser requires an absolute URL with a scheme, so example.com/path is invalid input. Prefix the URL with https:// to parse it. Other rejections include invalid characters in the host, malformed percent-encoding, and ports outside the 1–65535 range.

What happens with double-encoded URLs?

The parser decodes each parameter once. If a value was encoded twice before reaching you (%2520 for a space), the parser returns the once-decoded form (%20). Decode again with decodeURIComponent if you need the original space.

Does the parser run on the server?

The same WHATWG URL parser is available in Node.js (new URL(input)) and in every modern runtime, so server-side and client-side parsing produce identical results. This tool runs in your browser; no URL value is sent to a server.

Related tools

• HAR Viewer: Open and inspect HTTP Archive files captured from DevTools.
• User-Agent Parser: Decode any user agent string into browser, OS, and engine.
• Browser Info: Show your current browser, OS, language, and hardware capabilities.
• URL Encode / Decode: Encode or decode URL components and percent-encoded strings.