Кратко
СкопированоURL — это уникальный адрес ресурса в интернете (по англ. Uniform Resource Locator). С его помощью можно найти веб-сайт, картинку, файл и не только.
Как понять
СкопированоВ интернете приходится много искать. Чтобы человек не испытывал сложностей, существует URL — общепринятая последовательность символов, которая определяет расположение ресурса в сети, а также способ получить к нему доступ.
Вводим ссылочку — находим информацию 😼
Как пишется
СкопированоКлассическая абсолютная ссылка выглядит так:
https://doka.guide/tools/url
https:/tools/url
Она ведёт на текущую статью в разделе «инструменты» Доки и состоит из нескольких частей.
Схема
Скопированоhttps — это протокол (или схема), он нужен для правильного обмена данными между сервером и клиентом. http тоже протокол, но он без шифрования и не обеспечивает надёжную защиту данных. За схемой следует : — это разделитель.
Иногда встречаются и другие варианты протоколов: mailto для электронной почты и ftp для передачи файлов. mailto часто можно увидеть в ссылках для обратной связи, как ниже:
<a href="mailto:hi@doka.guide">Напиши Дока Догу</a>
<a href="mailto:hi@doka.guide">Напиши Дока Догу</a>
Authority часть
После разделителя : следует часть, названная «authority» (как это перевести на русский до конца не понятно 🤖). Она начинается двойной косой чертой / и содержит чаще всего хост, но может включать также информацию о пользователе или порт.
Её структура следующая: authority
Информация о пользователе
Скопировано«authority» часть может содержать информацию о пользователе:
http://admin:123@www.dostup-ko-vsey-zhizni.com/login
http:/login
В таком случае admin это логин, 123 пароль, @ разделитель, а @www имя хоста. Авторизация пройдёт автоматически, потому что браузер возьмёт всю информацию из ссылки.
Доменное имя
СкопированоС помощью доменного имени или имени хоста doka мы указываем, на какой ресурс хотим попасть. Это понятная человеку форма записи, а на самом деле всё работает немного иначе.
У каждого сайта есть IP-адрес (или адреса), например, 95. Чтобы людям не пришлось страдать, запоминая набор цифр вроде телефонного номера нового друга, существуют DNS (по англ. Domain Name Service).
DNS — это сервисы, которые связывают IP-адреса с понятными людям названиями, словно приложение телефонной книги на смартфоне соединяет номер телефона и имя человека. Спрашиваем doka, но на самом деле запрашиваем IP-адрес Доки.
Жмём «позвонить Игорю», а «под капотом» набираем его номер.
Порт
СкопированоЕщё после доменного имени может встретиться порт, служащий техническим параметром. Стандартные порты 80 для протокола HTTP и 443 для HTTPS размещать в ссылке не принято:
https://doka.guide:443/tools/url
https:/tools/url
Ведёт туда же, что и:
https://doka.guide/tools/url
https:/tools/url
Разработчик может менять порты, чтобы закрепить за ними сервисы с разными функциями. Ещё это может улучшить безопасность: пользователи будут попадать на ресурс через один порт, а администратор через другой, так что хакерам как минимум придётся поискать нужное место входа.
Внутри сайта
Скопированоtools — это путь до ресурса внутри веб-сайта. Мы как бы говорим: сначала перейди на сайт doka, а там ищи страничку tools, после чего перейди на страничку url (здесь вы читаете эту статью).
Динамические URL генерируются скриптами в ответ на запросы пользователя и содержат параметры для изменения содержимого страницы. Ссылка ниже получится, если ввести в поисковике Доки слово «привет».
https://doka.guide/search/?query=привет
https:/search/?query=привет
Параметры начинаются после знака ? и разделяются знаком &. Следующая ссылка формируется в ответ на поиск в Доке с включёнными фильтрами:
https://doka.guide/search/?query=привет&category=html&category=js&category=recipes
https:/search/?query=привет&category=html&category=js&category=recipes
Знаки & разделяют пары ключ-значение по типу ?ключ. В ссылке выше это, например, category, что означает фильтрацию статей в поиске по ключу html.
URL также может содержать якорь. Он ведёт в некоторое место на текущей странице. Вот так выглядит ссылка на главу «Кратко» в начале:
https://doka.guide/tools/url/#kratko
https:/tools/url/#kratko
Относительные ссылки
СкопированоСуществуют также относительные URL. Они выглядят похоже и могут быть удобны для создания навигации внутри сайта. У таких ссылок нет доменного имени, потому что браузер может подставить недостающие части сам, исходя из адреса текущего документа.
tools/url
tools/url
Если создать на главной странице Доки ссылку выше и кликнуть по ней, браузер превратит её в https, потому что мы уже находимся на https.
Косая черта / в начале пути покажет браузеру, что ссылка строится относительно корня сервера. А чтобы подняться на уровень выше, нужно использовать конструкцию .:
https://doka.guide/people/../
https:/people/../
Это будет значить то же, что и:
https://doka.guide
https:
На практике
Скопированосоветует
Скопировано🛠 На одном домене несколько серверов могут обрабатывать каждый своё: кто-то электронную почту, кто-то файлы, кто-то сайт. Поэтому можно встретить URL с доменом третьего уровня, для почты ссылка с ним выглядит так:
mail.google.com
mail.google.com
А для сайта так:
www.doka.guide
www.doka.guide
www расшифровывается как «World Wide Web», но сегодня уже не обязательно добавлять www к доменному имени, так как для большинства адресов настроен редирект на www версию или наоборот c www версии на обычную.
🛠 В JS есть удобный объект URL для создания поисковых ссылок. С его помощью можно настраивать и удобно вставлять в HTML пары ключ-значение для нужного запроса.
🛠 Быстро создать ссылку можно с помощью конструктора URL, например:
let url = new URL('https://doka.guide')
let url = new URL('https://doka.guide')