# External links use noopener noreferrer

- **Pattern:** `ab-002435` (`security-headers-ii.cross-origin-isolation.noopener-external-links`)
- **Severity:** low
- **Lifecycle:** active
- **Last modified:** 2026-04-18
- **Canonical URL:** https://auditbuffet.com/patterns/ab-002435
- **License:** CC-BY-4.0 — attribute to AuditBuffet Pattern Catalog (https://auditbuffet.com/patterns/ab-002435)

## Why it matters

An external link opened with `target='_blank'` without `rel='noopener'` gives the opened page access to `window.opener` — a reference back to your tab's window object. A malicious destination site (or one compromised via XSS) can call `window.opener.location = 'https://phishing-site.com'` to silently redirect your tab to a phishing page while the user is reading the opened content. CWE-1021 (Improper Restriction of Rendered UI Layers) applies directly. OWASP A05 lists missing `noopener` as a common misconfiguration. Modern browsers now default to `noopener`, but explicit attributes are required for backward compatibility and code-review clarity.

## Severity rationale

Low because modern browsers default `target='_blank'` to noopener behavior, but explicit `rel='noopener noreferrer'` is required for older browser compatibility and eliminates referrer leakage to external domains.

## Remediation

Add `rel='noopener noreferrer'` to every `<a target='_blank'>` pointing to an external domain. The `noreferrer` attribute also prevents sending your page URL as the HTTP Referer to the destination.

```tsx
// All external links opening in new tabs
<a
  href="https://example.com"
  target="_blank"
  rel="noopener noreferrer"
>
  External Link
</a>
```

In Next.js, the `<Link>` component automatically adds `rel='noopener'` for external links with `target='_blank'` in recent versions — but `noreferrer` must still be added manually if you want to suppress Referer headers.

## Detection

- **ID:** `noopener-external-links`
- **Severity:** `low`
- **What to look for:** Search all components and page files for external links with `target="_blank"`. For each, check whether `rel="noopener noreferrer"` (or equivalent framework behavior) is present. In Next.js, the `<Link>` component automatically adds `rel="noopener"` for external links with `target="_blank"`. Count all external links with `target="_blank"`.
- **Pass criteria:** 100% of external links with `target="_blank"` have `rel="noopener noreferrer"` or equivalent framework-provided behavior. Report: "X of Y external links have noopener."
- **Fail criteria:** Any external link with `target="_blank"` lacks `rel="noopener"` or equivalent.
- **Skip (N/A) when:** No external links with `target="_blank"` found in any component.
- **Detail on fail:** `"X of Y external links with target='_blank' lack rel='noopener noreferrer'"` or `"External link in Footer component missing noopener — target page can access window.opener"`
- **Remediation:** Without `noopener`, the opened page can access `window.opener` and navigate your page to a phishing URL. Add `rel="noopener noreferrer"` to all external links:

  ```tsx
  <a href="https://example.com" target="_blank" rel="noopener noreferrer">
    External Link
  </a>
  ```

  Modern browsers default to `noopener` behavior, but explicit is better for compatibility and clarity.

## External references

- cwe CWE-1021
- owasp A05

Taxons: access-control

HTML version: https://auditbuffet.com/patterns/ab-002435
