Link

Typed links in a header — preload hints, preconnects, canonical URLs and pagination.

Link carries the same relationships as HTML <link> elements, but in the response headers — so the browser sees them before parsing any HTML, and they work for responses that aren't HTML at all. It's used for resource hints, for canonical URLs on PDFs and other files, and by APIs such as GitHub's for pagination.

Syntax

Link: <uri>; rel="<relation>"[; <param>=<value>], …

Defined in RFC 8288 — Web Linking.

Values

rel=preload	fetch this resource early; needs `as=`
rel=preconnect	open a connection to this origin early
rel=canonical	the preferred URL for this content
rel="next" / "prev"	pagination in APIs

Examples

Link: </fonts/inter.woff2>; rel=preload; as=font; type="font/woff2"; crossorigin

preload a web font

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

warm up a connection to a CDN

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

point a PDF at its HTML page

Link: <https://api.example.com/items?page=3>; rel="next"

API pagination

Good to know

The URI goes in angle brackets.
Preload links pair well with 103 Early Hints, which lets the browser start fetching before the final response is ready.
Font preloads need crossorigin, even from your own origin.

How to set Link

Express

res.set("Link", "</fonts/inter.woff2>; rel=preload; as=font; type=\"font/woff2\"; crossorigin");

Next.js (next.config.js)

module.exports = {
  async headers() {
    return [
      {
        source: "/(.*)",
        headers: [{ key: "Link", value: "</fonts/inter.woff2>; rel=preload; as=font; type=\"font/woff2\"; crossorigin" }],
      },
    ];
  },
};

nginx

add_header Link "</fonts/inter.woff2>; rel=preload; as=font; type=\"font/woff2\"; crossorigin" always;

Apache (.htaccess)

Header always set Link "</fonts/inter.woff2>; rel=preload; as=font; type=\"font/woff2\"; crossorigin"

Check it

Fetch only the response headers and filter for Link. In the browser, it's under Response Headers in DevTools → Network.

curl -sI https://example.com/ | grep -i '^link:'

To compare response headers across many URLs at once, use the HTTP Status Checker.

Frequently asked questions

Does Google support rel=canonical in the Link header?

Yes. Google documents it as the way to set a canonical URL for non-HTML files such as PDFs.

Status codes it appears with

103 Early Hints