Skip to content
AITroveRead. Build. Understand.
Reading list
Make this comfortable

HTML iframe referrerpolicy: limit parent-page details sent to an embed

Last updated: 5 Oct 20266 min read
tutorial
IntermediateBy AITrove Editorial

An iframe has its own navigation request. Its referrerpolicy attribute controls referrer information for that request; it does not make the framed document trustworthy or anonymous.

Choose the contract

An intake record embeds a help panel that is maintained by a separate route. The parent URL may contain a case identifier, so the frame request should not carry it as a referrer. A no-referrer policy makes that intent explicit. The child can still learn anything placed in its own requested URL, messages sent by the parent, or data available through other permitted interfaces. Keep identifiers out of the frame source when they are unnecessary, use a clear title, and assess the origin and sandbox policy separately. A same-origin frame may have broad access to its parent unless another boundary changes that relationship. Referrer policy addresses one channel only; it does not grant isolation.

html
<section aria-labelledby="intake-help-heading">
  <h2 id="intake-help-heading">Intake help</h2>
  <iframe src="/help/intake-rules" title="Parcel intake rules"
          width="560" height="420" loading="lazy"
          referrerpolicy="no-referrer"></iframe>
  <p>The intake rules are also available as ordinary page text.</p>
</section>

Cost and verification

The frame creates another document and potentially its own script, style, and image requests. Lazy loading can defer that cost when help starts below the fold, but it does not remove it. Test the actual request headers, frame title, keyboard entry and exit, and failure display. The local help route in the sample must exist before deployment. For an untrusted external origin, evaluate sandbox and permissions separately; referrerpolicy does not stop the embedded page from running code or requesting features allowed to it.

Common Mistakes

  • Do not place a case token in src and expect no-referrer to hide it.
  • Do not confuse referrer policy with iframe sandboxing.
  • Do not assume the content between iframe tags is reliable fallback in modern browsers.

Connected lessons

html
browser-contract
Storage details