Заголовок HTTP Link позволяет сериализовать одну или несколько ссылок в заголовках HTTP. Это позволяет серверу указать клиенту на другой ресурс, содержащий метаданные о запрошенном ресурсе. Этот заголовок имеет ту же семантику, что и элемент HTML <link>. Одно из преимуществ использования заголовка Link заключается в том, что браузер может начать предварительное подключение к ресурсам или их предварительную загрузку до того, как HTML будет получен и обработан.

На практике большинство типов ссылок rel не работают при использовании в заголовке HTTP. Например, отношение icon работает только в HTML, а stylesheet ненадёжно работает в разных браузерах (только в Firefox). Надёжно работают только отношения preconnect и preload, которые можно использовать вместе с 103 Early Hints.

Синтаксис

Link: <uri-reference>; param1=value1; param2="value2"

<uri-reference>

Ссылка URI должна быть заключена между < и > и закодирована с помощью процентного кодирования.

Параметры

Заголовок ссылки содержит параметры, разделённые символом ; и эквивалентные атрибутам элемента <link>. Значения могут быть заключены в кавычки или указаны без кавычек в соответствии с правилами формирования компонентов значений полей, поэтому x=y эквивалентно x="y".

Примеры

Заключение URL в угловые скобки

URI (абсолютный или относительный) должен быть заключён между < и >:

Link: <https://example.com>; rel="preconnect"

Link: https://bad.example; rel="preconnect"

Кодирование URL

В URI (абсолютном или относительном) необходимо кодировать с помощью процентного кодирования коды символов, превышающие 255:

Link: <https://example.com/%E8%8B%97%E6%9D%A1>; rel="preconnect"

Link: <https://example.com/苗条>; rel="preconnect"

Указание нескольких ссылок

Можно указать несколько ссылок, разделённых запятыми, например:

Link: <https://one.example.com>; rel="preconnect", <https://two.example.com>; rel="preconnect", <https://three.example.com>; rel="preconnect"

Постраничная навигация по ссылкам

Заголовок Link может предоставлять клиенту сведения о постраничной навигации, что часто используется для программного доступа к ресурсам:

Link: <https://api.example.com/issues?page=2>; rel="prev", <https://api.example.com/issues?page=4>; rel="next", <https://api.example.com/issues?page=10>; rel="last", <https://api.example.com/issues?page=1>; rel="first"

В этом случае rel="prev" и rel="next" указывают отношения ссылок для предыдущей и следующей страниц, а параметры rel="last" и rel="first" задают первую и последнюю страницы результатов поиска.

Управление приоритетом загрузки

Даже при использовании preload для максимально ранней загрузки ресурса разные типы содержимого загружаются раньше или позже в соответствии с внутренними приоритетами браузера. Атрибут fetchpriority позволяет сообщить браузеру, что определённый ресурс оказывает большее или меньшее относительное влияние на взаимодействие с пользователем, чем другие ресурсы того же типа.

Например, приведённый ниже заголовок можно использовать для предварительной загрузки style.css с более высоким приоритетом, чем у других таблиц стилей:

Link: </style.css>; rel=preload; as=style; fetchpriority="high"

Обратите внимание, что внутренние приоритеты загрузки ресурсов и эффект директивы fetchpriority зависят от браузера. Директиву fetchpriority следует использовать экономно и только в тех случаях, когда браузер не может определить, что к определённому ресурсу следует применить другой приоритет.

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

Совместимость с браузерами

См. также

• 103 Early Hints
• <link>
• Отношения ссылок в реестре IANA
• Оптимизация загрузки ресурсов с помощью Fetch Priority API: сведения о том, как этот API влияет на приоритеты в Chrome.