HTML link Tag referrerpolicy Attribute Tutorial

In this section, we will learn what the referrerpolicy attribute is and how to use it.

What is referrerpolicy Attribute in HTML <link> Tag?

With the referrerpolicy attribute, we can declare if the request that is sent from the current document to get the document specified in the `href` attribute should also declare where this request is coming from. If yes, under what condition.

This means if, for example, the page A is sending a request to a website with the address “B”, in that request, should it say the request is coming from the website A or not?

This attribute is basically in charge of an HTTP header called “referer” (sic).

Depending on the value we set for the referrerpolicy attribute, the address of the current document might be set as the value of the referer header.

HTML referrerpolicy Attribute in <link> Tag Syntax:

<link href = “target document” referrerpolicy = “value”>

<link> Tag referrerpolicy Attribute Values

Here’s the list of values we can set for this attribute:

Name

Description

no-referrer

No referrer information will be sent along with a request

no-referer-when-downgrage

Default. The referrer header will not be sent to origins without HTTPS

origin

Send only scheme, host, and port to the request client

origin-when-cross-origin

For cross-origin requests (when website A wants to send a request to website B): Send only scheme, host, and port. For same-origin requests (Website A requesting a page from the same website A): Also include the path.

unsafe-url

Send origin, path and query string (but not fragment, password, or username). This value is unsafe and it’s better not to use it.

Example: using referrerpolicy attribute in HTML <link> tag

See the Pen using referrerpolicy attribute in HTML <link> tag by Omid Dehghan (@odehghan) on CodePen.

Leave a Reply