Link

Der HTTP Link-Header bietet eine Möglichkeit, ein oder mehrere Links in HTTP-Headern zu serialisieren. Dies ermöglicht es dem Server, einen Client auf eine andere Ressource hinzuweisen, die Metadaten über die angeforderte Ressource enthält. Dieser Header hat die gleichen Semantiken wie das HTML-Element <link>. Ein Vorteil der Verwendung des Link-Headers ist, dass der Browser mit dem Vorverbindungsaufbau oder dem Vorladen von Ressourcen beginnen kann, bevor das HTML selbst abgerufen und verarbeitet wird.

In der Praxis haben die meisten rel-Link-Typen keine Wirkung, wenn sie mit dem HTTP-Header verwendet werden. Zum Beispiel funktioniert die icon-Relation nur in HTML, und stylesheet funktioniert nicht zuverlässig über verschiedene Browser hinweg (nur in Firefox). Die einzigen Relationen, die zuverlässig funktionieren, sind preconnect und preload, die mit 103 Early Hints kombiniert werden können.

Header-Typ Antwort-Header, Anfrage-Header
Verbotener Anfrage-Header Nein
CORS-Whitelist-Antwort-Header Nein

Syntax

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

Die URI-Referenz muss zwischen < und > eingeschlossen und prozentcodiert sein.

Parameter

Der Link-Header enthält Parameter, die mit ; getrennt werden und den Attributen des <link>-Elements entsprechen. Werte können sowohl in Anführungszeichen als auch ohne Anführungszeichen sein, basierend auf Regeln für Feldwertkomponenten, so dass x=y äquivalent zu x="y" ist.

Beispiele

URLs in spitze Klammern einschließen

Die URI (absolut oder relativ) muss zwischen < und > eingeschlossen sein:

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

URLs kodieren

Die URI (absolut oder relativ) muss Zeichenkodierungen größer als 255 prozentcodieren:

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

Es können mehrere Links angegeben werden, die durch Kommas getrennt sind, zum Beispiel:

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

Der Link-Header kann Paginierungsinformationen für einen Client bereitstellen, die häufig dazu verwendet werden, Ressourcen programmgesteuert zuzugreifen:

http
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"

In diesem Fall zeigen rel="prev" und rel="next" Link-Relationen für vorherige und nächste Seiten an, und es gibt rel="last" und rel="first"-Parameter, die erste und letzte Seiten von Suchergebnissen bereitstellen.

Abrufpriorität steuern

Auch bei der Verwendung von preload, um eine Ressource so früh wie möglich abzurufen, werden verschiedene Arten von Inhalten früher oder später basierend auf der internen Priorisierung des Browsers abgerufen. Das fetchpriority-Attribut kann verwendet werden, um dem Browser anzudeuten, dass eine bestimmte Ressource einen größeren oder geringeren relativen Einfluss auf die Benutzererfahrung haben wird als andere Ressourcen desselben Typs.

Zum Beispiel könnte der unten stehende Header verwendet werden, um style.css mit einer höheren Priorität als andere Stylesheets vorzuladen:

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

Beachten Sie, dass sowohl die interne Priorisierung zum Abrufen von Ressourcen als auch die Wirkung der fetchpriority-Direktive browserabhängig sind. Die fetchpriority-Direktive sollte sparsam eingesetzt werden und nur in Fällen, in denen ein Browser nicht ableiten kann, dass eine bestimmte Ressource mit einer anderen Priorität behandelt werden sollte.

Spezifikationen

Specification
Web Linking
# header

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch