15 dicembre 2021

URL objects

La classe built-in URL fornisce una comoda interfaccia per la creazione ed il parsing degli URL.

Non esistono metodi di networking che richiedono esattamente un oggetto di tipo URL, in quanto le stringhe sono già abbastanza adatte allo scopo. Quindi, tecnicamente non siamo obbligati all’utilizzo di URL. Talvolta però può essere molto utile.

Creare un URL

Ecco la sintassi per creare un nuovo oggetto URL:

new URL(url, [base])
  • url – l’URL completo o solo il path (se il parametro base è stato impostato, vedi il parametro seguente),
  • base – un base URL opzionale: se è impostato e l’argomento url contiene solamente il path, l’URL viene generato in relazione a base.

Ad esempio:

let url = new URL('https://javascript.info/profile/admin');

Questi due URL sono identici:

let url1 = new URL('https://javascript.info/profile/admin');
let url2 = new URL('/profile/admin', 'https://javascript.info');

alert(url1); // https://javascript.info/profile/admin
alert(url2); // https://javascript.info/profile/admin

Possiamo facilmente creare un nuovo URL basato su uno già esistente:

let url = new URL('https://javascript.info/profile/admin');
let newUrl = new URL('tester', url);

alert(newUrl); // https://javascript.info/profile/tester

L’oggetto URL ci permette di accedere alle sue componenti, fornendo un modo elegante di effettuare il parsing dell’url, ad esempio:

let url = new URL('https://javascript.info/url');

alert(url.protocol); // https:
alert(url.host);     // javascript.info
alert(url.pathname); // /url

Ecco una tabella informativa per le componenti dell’URL:

  • href è l’url completo, equivalente di url.toString()
  • protocol termina con il carattere :
  • search è una stringa contenente parametri, comincia con il punto interrogativo ?
  • hash comincia con il carattere cancelletto #
  • possono essere presenti anche le proprietà user e password, se è presente l’autenticazione HTTP: http://login:password@site.com (non illustrata nella figura precedente, perché è usata molto raramente).
Possiamo passare gli oggetti URL ai metodi di networking (e molti altri) anziché una stringa

Possiamo usare un oggetto URL dentro fetch o XMLHttpRequest, ed in generale, quasi ovunque ci si aspetti una stringa.

Generalmente, l’oggetto URL può essere passato a qualunque metodo al posto di una stringa, dal momento che la maggior parte di essi, effettueranno una conversione automatica in stringa, trasformando, quindi, un oggetto URL