URLPattern()
The URLPattern()
constructor returns a new URLPattern
object representing the url pattern defined by the parameters.
Note: This feature is available in Web Workers
Syntax
new URLPattern(input); new URLPattern(input, baseURL);
Parameters
input
-
The pattern that will be used for matching. This can either be a
USVString
, or an object providing patterns for each URL part individually. The object members can be any ofprotocol
,username
,password
,hostname
,port
,pathname
,search
,hash
, orbaseURL
. Omitted parts in the object will be treated as wildcards (*
). -
baseURL
Optional -
A
USVString
representing the base URL to use in cases whereinput
is a relative pattern. If not specified, it defaults toundefined
.
Exceptions
TypeError
-
Indicates one of the following:
- The given pattern or base URL is not valid or syntactically correct.
- A
baseURL
is provided, and input is an absolute pattern or a structured object.
Examples
// Matching a pathname let pattern = new URLPattern('https://example.com/books/:id') = new URLPattern( '/books/:id', 'https://example.com', ) = new URLPattern({ protocol: 'https', hostname: 'example.com', pathname: '/books/:id', }) = new URLPattern({ pathname: '/books/:id', baseURL: 'https://example.com', }); // Match the protocol and hostname let pattern = new URLPattern({ protocol: 'http{s}?', hostname: ':subdomain.example.com', }); // Match all possible structured parts let pattern = new URLPattern({ protocol: 'http{s}?', username: ':username', password: ':password', hostname: ':subdomain.example.com', port: ':port(80|443)', pathname: '/:path', search: '*', hash: '*', });
Usage notes
The URLPattern
constructor has two forms. The constructor either takes a pattern object, or a pattern string and optional baseURL.
new URLPattern(obj); new URLPattern(pattern[, baseURL]);
The first type of constructor (see above) takes an object that describes the URLs that should be matched by specifying patterns for each individual URL part. Its members can be any of protocol
, username
, password
, hostname
, port
, pathname
, search
, hash
, or baseURL
. If the baseURL property is provided it will be parsed as a URL and used to populate any other properties that are missing. If the baseURL property is missing, then any other missing properties default to the pattern *
wildcard, accepting any input.
The second type of constructor (see above) takes a URL string that contains patterns embedded in it. The URL string may be relative if a base URL is provided as the second argument. Note, it may be necessary to escape some characters in the URL string where its ambiguous whether the character is separating different URL components or if it's instead part of a pattern. For example, you must write about\\:blank
to indicate that the :
is the protocol suffix and not the start of a :blank
named group pattern.
Specifications
Specification |
---|
URLPattern API # dom-urlpattern-urlpattern |
Browser compatibility
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
URLPattern |
95
93-95
|
95
93-95
|
No |
No |
81 |
No |
No |
95
93-95
|
No |
No |
No |
No |
See also
- A polyfill of
URLPattern
is available on GitHub
© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/URLPattern/URLPattern