Last updated
URL Structure
A URL (Uniform Resource Locator) has a defined structure specified in RFC 3986. Each component is optional except the scheme, but most valid web URLs include scheme, host, and path at minimum.
Text
scheme://[userinfo@]host[:port]/path[?query][#fragment]
Example:
https://user:pass@api.example.com:8080/v1/users?limit=10&page=2#results
scheme = https
userinfo = user:pass
host = api.example.com
port = 8080
path = /v1/users
query = limit=10&page=2
fragment = results
URL Validation in JavaScript
JavaScript
function validateUrl(input) {
try {
const url = new URL(input);
return {
valid: true,
scheme: url.protocol.replace(':', ''),
host: url.hostname,
port: url.port || null,
path: url.pathname,
query: url.search,
fragment: url.hash,
isHttps: url.protocol === 'https:'
};
} catch {
return { valid: false, reason: 'Invalid URL format' };
}
}
// Additional checks
function validateWebUrl(input) {
const result = validateUrl(input);
if (!result.valid) return result;
if (!['http:', 'https:'].includes(new URL(input).protocol))
return { valid: false, reason: 'Only http/https allowed' };
if (!result.host.includes('.'))
return { valid: false, reason: 'Invalid hostname' };
return result;
}
Common URL Validation Mistakes
- Using regex instead of the URL constructor — regex-based URL validation is notoriously error-prone.
- Not handling internationalized domain names (IDN) —
münchen.deis valid but needs punycode encoding. - Forgetting that
localhostand IP addresses are valid hosts. - Treating the fragment (
#hash) as part of the server request — it's client-side only.