URL utils for humans.
Install using npm or your favourite package manager:
Install package:
# npm
npm install ufo
# yarn
yarn add ufo
# pnpm
pnpm install ufo
# bun
bun install ufoImport utils:
// ESM
import { normalizeURL, joinURL } from "ufo";
// CommonJS
const { normalizeURL, joinURL } = require("ufo");
// Deno
import { parseURL } from "https://unpkg.com/ufo/dist/index.mjs";Decode text using decodeURIComponent. Returns the original text if it fails.
Decode path section of URL (consistent with encodePath for slash encoding).
Decodes query key (consistent with encodeQueryKey for plus encoding).
Decode query value (consistent with encodeQueryValue for plus encoding).
Encode characters that need to be encoded on the path, search and hash sections of the URL.
Encode characters that need to be encoded on the hash section of the URL.
Encodes hostname with punycode encoding.
Encode characters that need to be encoded on the path section of the URL as a param. This function encodes everything encodePath does plus the slash (/) character.
Encode characters that need to be encoded on the path section of the URL.
Encode characters that need to be encoded query values on the query section of the URL and also encodes the = character.
Encode characters that need to be encoded query values on the query section of the URL.
Takes a string of the form username:password and returns an object with the username and password decoded.
Parses a url and returns last segment in path as filename.
If { strict: true } is passed as the second argument, it will only return the last segment only if ending with an extension.
Example:
// Result: filename.ext
parseFilename("http://example.com/path/to/filename.ext");
// Result: undefined
parseFilename("/path/to/.hidden-file", { strict: true });Takes a string, and returns an object with two properties: hostname and port.
Splits the input string into three parts, and returns an object with those three parts.
Takes a URL string and returns an object with the URL's protocol, auth, host, pathname, search, and hash.
Example:
parseURL("http://foo.com/foo?test=123#token");
// { protocol: 'http:', auth: '', host: 'foo.com', pathname: '/foo', search: '?test=123', hash: '#token' }
parseURL("foo.com/foo?test=123#token");
// { pathname: 'foo.com/foo', search: '?test=123', hash: '#token' }
parseURL("foo.com/foo?test=123#token", "https://");
// { protocol: 'https:', auth: '', host: 'foo.com', pathname: '/foo', search: '?test=123', hash: '#token' }Takes a ParsedURL object and returns the stringified URL.
Example:
const obj = parseURL("http://foo.com/foo?test=123#token");
obj.host = "bar.com";
stringifyParsedURL(obj); // "http://bar.com/foo?test=123#token"Encodes a pair of key and value into a url query string value.
If the value is an array, it will be encoded as multiple key-value pairs with the same key.
Parses and decodes a query string into an object.
input can be a query string with or without the leading ?
Stringfies and encodes a query object into a query string.
Removes double slashes from the URL.
Example:
cleanDoubleSlashes("//foo//bar//"); // "/foo/bar/"
cleanDoubleSlashes("http://example.com/analyze//http://localhost:3000//");
// Returns "http://example.com/analyze/http://localhost:3000/"Parses and decods the query object of an input URL into an object.
Example:
getQuery("http://foo.com/foo?test=123&unicode=%E5%A5%BD");
// { test: "123", unicode: "ๅฅฝ" }Checks if the input has a leading slash. (e.g. /foo)
Checks if the input has a trailing slash.
Checks if the input url is empty or /.
Checks if two paths are equal regardless of encoding, trailing slash, and leading slash differences.
You can make slash check strict by setting { trailingSlash: true, leadingSlash: true } as options.
You can make encoding check strict by setting { encoding: true } as options.
Example:
isEqual("/foo", "foo"); // true
isEqual("foo/", "foo"); // true
isEqual("/foo bar", "/foo%20bar"); // true
// Strict compare
isEqual("/foo", "foo", { leadingSlash: true }); // false
isEqual("foo/", "foo", { trailingSlash: true }); // false
isEqual("/foo bar", "/foo%20bar", { encoding: true }); // falseChecks if the input url is not empty nor /.
Check if a path starts with ./ or ../.
Example:
isRelative("./foo"); // trueCheck two paths are equal or not. Trailing slash and encoding are normalized before comparison.
Example:
isSamePath("/foo", "/foo/"); // trueChecks if the input protocol is any of the dangerous blob:, data:, javascript: or vbscript: protocols.
Joins multiple URL segments into a single URL and also handles relative paths with ./ and ../.
Example:
joinRelativeURL("/a", "../b", "./c"); // "/b/c"Joins multiple URL segments into a single URL.
Example:
joinURL("a", "/b", "/c"); // "a/b/c"Normlizes inputed url:
- Ensures url is properly encoded - Ensures pathname starts with slash - Preserves protocol/host if provided
Example:
normalizeURL("test?query=123 123#hash, test");
// Returns "test?query=123%20123#hash,%20test"
normalizeURL("http://localhost:3000");
// Returns "http://localhost:3000"Resolves multiple URL segments into a single URL.
Example:
resolveURL("http://foo.com/foo?test=123#token", "bar", "baz");
// Returns "http://foo.com/foo/bar/baz?test=123#token"Ensures the URL or pathname has a trailing slash.
If input aleady start with base, it will not be added again.
Add/Replace the fragment section of the URL.
Example:
withFragment("/foo", "bar"); // "/foo#bar"
withFragment("/foo#bar", "baz"); // "/foo#baz"
withFragment("/foo#bar", ""); // "/foo"Adds or replaces url protocol to http://.
Example:
withHttp("https://example.com"); // http://example.comAdds or replaces url protocol to https://.
Example:
withHttps("http://example.com"); // https://example.comEnsures the URL or pathname has a leading slash.
Removes the base from the URL or pathname.
If input does not start with base, it will not be removed.
Removes the fragment section from the URL.
Example:
withoutFragment("http://example.com/foo?q=123#bar")
// Returns "http://example.com/foo?q=123"Removes the host from the URL preserving everything else.
Example:
withoutHost("http://example.com/foo?q=123#bar")
// Returns "/foo?q=123#bar"Removes leading slash from the URL or pathname.
Removes the protocol from the input.
Example:
withoutProtocol("http://example.com"); // "example.com"Removes trailing slash from the URL or pathname.
If second argument is true, it will only remove the trailing slash if it's not part of the query or fragment with cost of more expensive operations.
Example:
withoutTrailingSlash("/foo/"); // "/foo"
withoutTrailingSlash("/path/?query=true", true); // "/path?query=true"Adds or Replaces protocol of the input URL.
Example:
withProtocol("http://example.com", "ftp://"); // "ftp://example.com"Add/Replace the query section of the URL.
Example:
withQuery("/foo?page=a", { token: "secret" }); // "/foo?page=a&token=secret"Ensures url ends with a trailing slash.
If seccond argument is true, it will only add the trailing slash if it's not part of the query or fragment with cost of more expensive operation.
Example:
withTrailingSlash("/foo"); // "/foo/"
withTrailingSlash("/path?query=true", true); // "/path/?query=true"Special thanks to Eduardo San Martin Morote (posva) for encoding utilities
![autofix-ci[bot] avatar](https://avatars.githubusercontent.com/in/243519?v=4 "autofix-ci[bot]")
![renovate[bot] avatar](https://avatars.githubusercontent.com/in/2740?v=4 "renovate[bot]")
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent