URL

Интерфейс URL используется для разбора, создания, нормализации и кодирования URL-адресов. Он предоставляет свойства, которые позволяют легко читать и изменять части URL-адреса.

Для создания объекта URL нужно вызвать конструктор, передав ему строку с абсолютным или относительным URL-адресом в качестве аргумента. В случае с относительным адресом в конструктор также нужно передать базовый адрес вторым аргументом. После этого вы получите доступ к частям URL-адреса для их чтения или модификации.

В случае, когда браузер не поддерживает URL() конструктор, вы можете получить доступ к объекту URL через URL свойство интерфейса Window. Проверьте, не нуждается ли какой-либо из ваших целевых браузеров в этом префиксе.

Примечание: Эта возможность доступна в Web Workers

Конструктор

new URL()

Создаёт и возвращает объект URL из указанного абсолютного адреса или пути и базового адреса.

Свойства

hash

Строка типа USVString. Содержит идентификатор фрагмента и символ '#' в начале строки.

host (en-US)

Строка типа USVString. Содержит доменное имя (hostname) за которым следует (если был указан порт) символ ':' и номер порта.

hostname (en-US)

Строка типа USVString. Содержит доменное имя.

href (en-US)

Строка типа USVString. Содержит полный URL-адрес.

origin (en-US) Только для чтения

Строка типа USVString. Содержит схему (протокол), доменное имя и номера порта.

password (en-US)

Строка типа USVString. Содержит пароль, указанный перед доменным именем.

pathname (en-US)

Строка типа USVString. Содержит относительный пусть и символ '/' в начале строки. Параметры запроса и идентификатор фрагмента не входят в эту строку.

port (en-US)

Строка типа USVString. Содержит номер порта.

protocol (en-US)

Строка типа USVString. Содержит название протокола и символ ':' на конце.

search (en-US)

Строка типа USVString. Содержит параметры запроса. Включает в себя все параметры, которые были указаны и начинается с символа '?'.

searchParams (en-US) Только для чтения

Объект URLSearchParams. Позволяет получить доступ к каждому параметру запроса по отдельности.

username (en-US)

Строка типа USVString. Содержит имя пользователя указанное перед именем домена.

Методы

toString() (en-US)

Возвращает строку типа USVString, содержащую полный URL-адрес. Возвращаемое значение аналогично значению свойства URL.href (en-US). Разница лишь в том, что при помощи этого метода нельзя изменить значение URL-адреса.

toJSON() (en-US)

Возвращает строку типа USVString, содержащую полный URL-адрес. Возвращаемое значение аналогично значению свойства URL.href (en-US).

Статические методы

createObjectURL()

Возвращает строку типа DOMString, содержащую уникальный URL-адрес Blob объекта. Этот адрес предоставляет из себя строку с blob: в качестве схемы, за которой идёт строка однозначно идентифицирующая Blob объект в браузере.

revokeObjectURL() (en-US)

Отменяет URL созданный при помощи URL.createObjectURL().

Примечания по использованию

Конструктор принимает один обязательный параметр — url и один необязательный параметр — base, который будет использован в качестве «основы», если параметр url это относительный URL-адрес:

const url = new URL('../cats', 'http://www.example.com/dogs');
console.log(url.hostname); // "www.example.com"
console.log(url.pathname); // "/cats"</pre>

Вы можете задавать значения свойствам объекта URL, чтобы изменять URL-адрес:

url.hash = 'tabby';
console.log(url.href); // "http://www.example.com/cats#tabby"

URL-адреса кодируются согласно стандарту RFC 3986. Например:

url.pathname = 'démonstration.html';
console.log(url.href); // "http://www.example.com/d%C3%A9monstration.html"

Интерфейс URLSearchParams можно использовать для работы с параметрами запроса.

Например, следующим образом можно получить параметры запроса URL-адреса текущей веб-страницы:

// https://some.site/?id=123
const parsedUrl = new URL(window.location.href);
console.log(parsedUrl.searchParams.get("id")); // "123"

Метод toString() (en-US) лишь возвращает значение свойства href (en-US). Благодаря этому, конструктор URL можно использовать для нормализации и кодирования URL-адреса.

const response = await fetch(new URL('http://www.example.com/démonstration.html'));

Спецификации

Specification
URL Standard
# api

Поддержка браузерами

BCD tables only load in the browser

Смотрите также