urlpattern polyfill
1.0.0
urlPattern是用於匹配URL的新Web API。它的目的是為Web開發人員提供方便的API，並在需要匹配URL的其他Web API中可用；例如服務工作者。解釋器討論了激勵的用例。
這是urlpattern API的多填充，因此該功能可在不本地支持的瀏覽器中可用。該多填充通過相同的Web平台測試套件。
多文件可在瀏覽器（ESM模塊）和node.js中工作。
僅當urlpattern在全局對像上尚未存在時，才會加載多填充，在這種情況下，它將其添加到全局對像中。
// Conditional ESM module loading (Node.js and browser)
// @ts-ignore: Property 'UrlPattern' does not exist
if ( ! globalThis . URLPattern ) {
await import ( "urlpattern-polyfill" ) ;
}
/**
* The above is the recommended way to load the ESM module, as it only
* loads it on demand, thus when not natively supported by the runtime or
* already polyfilled.
*/
import "urlpattern-polyfill" ;
/**
* In case you want to replace an existing implementation with the polyfill:
*/
import { URLPattern } from "urlpattern-polyfill" ;
globalThis . URLPattern = URLPattern 筆記：
在某些環境中，
// @ts-ignore: Property 'UrlPattern' does not exist的行：在加載polyfill之前，可能無法可用，並且IF語句中的功能檢查會給出打字錯誤錯誤。整個想法是，當它不存在時，它會加載。
// Conditional CJS module loading (Node.js)
if ( ! globalThis . URLPattern ) {
require ( "urlpattern-polyfill" ) ;
}
/**
* The above is the recommended way to load the CommonJs module, as it only
* loads it on demand, thus when not natively supported by the runtime or
* already polyfilled.
*/
require ( "urlpattern-polyfill" ) ;
/**
* In case you want to replace an existing implementation with the polyfill:
*/
const { URLPattern } = require ( "urlpattern-polyfill" ) ; ;
globalThis . URLPattern = URLPattern 筆記：
無論您如何加載polyfill，如果您的環境中沒有實現，它將始終將其添加到全局對像中。
let p = new URLPattern ( { pathname : '/foo/:name' } ) ;
let r = p . exec ( 'https://example.com/foo/bar' ) ;
console . log ( r . pathname . input ) ; // "/foo/bar"
console . log ( r . pathname . groups . name ) ; // "bar"
let r2 = p . exec ( { pathname : '/foo/baz' } ) ;
console . log ( r2 . pathname . groups . name ) ; // "baz" // Match same-origin jpg or png URLs.
// Note: This uses a named group to make it easier to access
// the result later.
const p = new URLPattern ( {
pathname : '/*.:filetype(jpg|png)' ,
baseURL : self . location
} ) ;
for ( let url in url_list ) {
const r = p . exec ( url ) ;
// skip non-matches
if ( ! r ) {
continue ;
}
if ( r . pathname . groups [ 'filetype' ] === 'jpg' ) {
// process jpg
} else if ( r . pathname . groups [ 'filetype' ] === 'png' ) {
// process png
}
}在這種情況下，可以通過剩下baseurl來使模式更簡單，而無需原點檢查。
// Match any URL ending with 'jpg' or 'png'.
const p = new URLPattern ( { pathname : '/*.:filetype(jpg|png)' } ) ; 我們計劃還支持用於初始化urlpattern對象的“簡短表格”。這得到了多填充的支持，但尚未得到鉻的實施。
例如：
const p = new URLPattern ( "https://*.example.com/foo/*" ) ;或者：
const p = new URLPattern ( "foo/*" , self . location ) ;下面找到帶有打字稿類型註釋的API概述。相關的瀏覽器Web IDL可以在此處找到。
type URLPatternInput = URLPatternInit | string ;
class URLPattern {
constructor ( init ?: URLPatternInput , baseURL ?: string ) ;
test ( input ?: URLPatternInput , baseURL ?: string ) : boolean ;
exec ( input ?: URLPatternInput , baseURL ?: string ) : URLPatternResult | null ;
readonly protocol : string ;
readonly username : string ;
readonly password : string ;
readonly hostname : string ;
readonly port : string ;
readonly pathname : string ;
readonly search : string ;
readonly hash : string ;
}
interface URLPatternInit {
baseURL ?: string ;
username ?: string ;
password ?: string ;
protocol ?: string ;
hostname ?: string ;
port ?: string ;
pathname ?: string ;
search ?: string ;
hash ?: string ;
}
interface URLPatternResult {
inputs : [ URLPatternInput ] ;
protocol : URLPatternComponentResult ;
username : URLPatternComponentResult ;
password : URLPatternComponentResult ;
hostname : URLPatternComponentResult ;
port : URLPatternComponentResult ;
pathname : URLPatternComponentResult ;
search : URLPatternComponentResult ;
hash : URLPatternComponentResult ;
}
interface URLPatternComponentResult {
input : string ;
groups : {
[ key : string ] : string | undefined ;
} ;
}這裡的模式語法基於流行的通道通道庫中使用的語法。
"/"字符。":"字符，然後是名稱開頭。例如， "/:foo/:bar"有兩個命名組。"/:foo(.*)"將覆蓋與下一個分隔線匹配的默認值。"?" ， "*"或"+"的功能，就像在正則表達式中一樣。當組是可選的或重複的，並且先於分隔器，則分隔線也是可選的或重複的。例如， "/foo/:bar?"將匹配"/foo" ， "/foo/"或"/foo/baz" 。逃脫的分隔線將使之改為需要。"(.*)"目前，我們計劃與regexp的這些已知差異：
URL具有基於ASCII的規範形式，這意味著國際化域名（主機名）也具有基於規範的ASCII表示的表示，並且其他組件（例如hash ， search和pathname使用百分比編碼進行編碼。
當前， URLPattern不執行模式的任何編碼或標準化。因此，開發人員將需要在將模式傳遞到構造函數中之前編碼Unicode字符。同樣，構造函數也不執行諸如 /foo/../bar to /bar之類的扁平路徑名。當前，必須將模式寫入目標規範URL輸出。
但是，它確實執行了這些操作以進行test()和exec()輸入。
編碼組件可以輕鬆手動完成，但不要編碼模式語法：
encodeURIComponent ( "?q=æøå" )
// "%3Fq%3D%C3%A6%C3%B8%C3%A5" new URL ( "https://ølerlækkernårdetermit.dk" ) . hostname
// "xn--lerlkkernrdetermit-dubo78a.dk"如果您在https://github.com/intel上擁有有關安全問題或漏洞的信息，請發送電子郵件至[email protected]。使用我們的PGP公鑰加密敏感信息。有關與英特爾產品有關的問題，請訪問https://security-center.intel.com。
