HTML referrerpolicy Attribute

Last Updated : 27 Sep, 2021

The HTML referrerpolicy attribute is used to define an HTTP header control that specifies the amount of reference information that would be sent to the server when fetching out the result from the server. It is mainly used with following elements: <a>,<area>,<link>,<img>,<iframe>and <script> element. Referrer policy is used to maintain the security and privacy of source account while fetching resources or performing navigation. This is done by modifying the algorithm used to populate Referrer HeaderPlease refer to the HTTP headers | Referrer-Policy article for further details.

Supported Tags:

<a>: It s used to specify the reference information that will be sent to the server when the user clicks on a hyperlink.
<area>: It is used to specify the reference information on the client-side that will be sent to the server when fetching out the result.
<script>: It is used to specify the reference information that will be sent to the server when fetching the script.
<img>: It is used to specify the reference information that will be sent to the server when fetching the image.
<iframe>: It is used to specify the reference information that will be sent when fetching the result.
<link>: It is used to specify the reference information that will be sent to the server when fetching out the resource.

Syntax:

<element referrerpolicy="value">

Values:

no-referrer: It specifies that no reference information will be sent along with a request.
no-referrer-when-downgrade: It has a default value. It specifies that refer header will not be sent to origins without HTTPS.
origin: It specifies to only send the origin of the document as the referrer in all cases.
origin-when-cross-origin: It sends the origin, path, and query string when performing a same-origin request, but only send the origin of the document for other cases.
same-origin: It specifies that the referrer will be sent for same-site origins, but cross-origin requests will send no referrer information.
strict-origin: It only sends the origin of the document as the referrer when the protocol security level stays the same (HTTPS/HTTPS), but don’t send it to a less secure destination (HTTPS/HTTP).
strict-origin-when-cross-origin: It sends the origin, path, and query string when performing a same-origin request, only sends the origin when the protocol security level stays the same while performing a cross-origin request (HTTPS/HTTPS), and send no header to any less-secure destinations (HTTPS/HTTP).
unsafe-url: It sends an origin, path, and query string as a piece of reference information but does not include password and username.

Example Code: Below code illustrates the use of referrerpolicy attribute in <iframe> element.

HTML

<!DOCTYPE html>
<html>
  <head>
    <title>HTML referrerpolicy Attribute</title>
  </head>
 
  <body style="text-align: center">
    <h1>GeeksforGeeks</h1>
 
    <h2>HTML referrerpolicy Attribute</h2>
 
    <iframe
      src="https://ide.geeksforgeeks.org/index.php"
      height="200"
      width="400"
      referrerpolicy="no-referrer">
    </iframe>
  </body>
</html>

Output: In this case, the value of the referrerpolicy attribute is set to “no-referrer”, which means that the no-referrer information will be sent to the server along with the HTTP request.

Example 2: Below code illustrates the use of referrerpolicy attribute in <a> tag.

HTML

<!DOCTYPE html>
<html>
  <head>
    <title>HTML referrerpolicy Attribute</title>
  </head>
 
  <body>
    <h2>GeeksForGeeks</h2>
    <h2>HTML referrerpolicy Attribute</h2>
     
<p>
      If you want to upgrade your coding skill then checkout the
      <a
        rel="noopener"
        href="https://www.geeksforgeeks.org/courses/"
        referrerpolicy="unsafe-url">
        GeeksforGeeks Courses
      </a>
    </p>
 
 
  </body>
</html>

Output: In this case, we have used the referrerpolicy attribute in the anchor element, the value is set to “unsafe-url” that sends an origin path, and query string as a piece of reference information but does not include password and username.