Referrer policy | Frontend Practical Guide

Widely available すべての主要ブラウザで対応済み。安心して使用可能。

対応ブラウザ

機能	デスクトップ				モバイル
機能	Chrome	Edge	Firefox	Safari	Chrome Android	Safari iOS
`api.HTMLAnchorElement.referrerPolicy`	52	79	50	14	52	14
HTML 属性
`referrerpolicy`	51	79	50	14	51	14
`referrerpolicy`	51	79	50	14	51	14
`referrerpolicy`	51	79	50	14	51	14
`referrerpolicy`	51	79	50	14	51	14
`referrerpolicy`	51	79	50	14	51	14
`referrerpolicy`	70	79	65	14	70	14
DOM API
`referrerPolicy (no-referrer-when-downgrade)` リファラーなし-ダウングレード時	52	79	61	14	52	14
`referrerPolicy (origin-when-cross-origin)` オリジン・ウェン・クロス・オリジン	52	79	61	14	52	14
`referrerPolicy (unsafe-url)` 安全でないurl	52	79	61	14	52	14
`referrerPolicy` HTMLAreaElement.referrerPolicy プロパティは、リソースの取得時に送信されるリファラーを定義する area 要素の HTML referrerpolicy 属性を反映します。	52	79	50	14.1	52	14.5
`referrerPolicy (no-referrer-when-downgrade)` リファラーなし-ダウングレード時	52	79	61	14.1	52	14.5
`referrerPolicy (origin-when-cross-origin)` オリジン・ウェン・クロス・オリジン	52	79	61	14.1	52	14.5
`referrerPolicy (unsafe-url)` 安全でないurl	52	79	61	14.1	52	14.5
`referrerPolicy` HTMLIFrameElement.referrerPolicy プロパティは HTML の iframe 要素の referrerpolicy 属性を反映し、リソースの取得時にどのリファラーを送信するかを定義します。	52	79	50	14	52	14
`referrerPolicy (no-referrer-when-downgrade)` リファラーなし-ダウングレード時	52	79	61	14	52	14
`referrerPolicy (origin-when-cross-origin)` オリジン・ウェン・クロス・オリジン	52	79	61	14	52	14
`referrerPolicy (unsafe-url)` 安全でないurl	52	79	61	14	52	14
`referrerPolicy` HTMLImageElement.referrerPolicy プロパティは、 HTML の img 要素の referrerpolicy 属性を反映し、リソースの取得時に送信されるリファラーを定義します。	52	79	50	14	52	14
`referrerPolicy (no-referrer-when-downgrade)` リファラーなし-ダウングレード時	52	79	61	14	52	14
`referrerPolicy (origin-when-cross-origin)` オリジン・ウェン・クロス・オリジン	52	79	61	14	52	14
`referrerPolicy (unsafe-url)` 安全でないurl	52	79	61	14	52	14
`referrerPolicy` HTMLLinkElement.referrerPolicy プロパティは、リソースの取得時に送信されるリファラーを定義する link 要素の HTML referrerpolicy 属性を反映します。	58	79	50	14.1	58	14.5
`referrerPolicy (no-referrer-when-downgrade)` リファラーなし-ダウングレード時	58	79	50	14.1	58	14.5
`referrerPolicy (origin-when-cross-origin)` オリジン・ウェン・クロス・オリジン	58	79	50	14.1	58	14.5
`referrerPolicy (unsafe-url)` 安全でないurl	58	79	50	14.1	58	14.5
`referrerPolicy` referrerPolicy は HTMLScriptElement インターフェイスのプロパティで、この script 要素の referrerpolicy を反映します。これは、スクリプトとそれがインポートするスクリプトを取得するときにリファラーをどのように設定するかを定義します。	70	79	65	14	70	14
`referrerPolicy (no-referrer-when-downgrade)` リファラーなし-ダウングレード時	70	79	65	14	70	14
`referrerPolicy (origin-when-cross-origin)` オリジン・ウェン・クロス・オリジン	70	79	65	14	70	14
`referrerPolicy (unsafe-url)` 安全でないurl	70	79	65	14	70	14
その他
`html.elements.a.referrerpolicy.no-referrer-when-downgrade` リファラーなし-ダウングレード時	51	79	50		51
`html.elements.a.referrerpolicy.origin-when-cross-origin` オリジン・ウェン・クロス・オリジン	51	79	50		51
`html.elements.a.referrerpolicy.unsafe-url` 安全でないurl	51	79	50		51
`html.elements.area.referrerpolicy.no-referrer-when-downgrade` リファラーなし-ダウングレード時	51	79	50		51
`html.elements.area.referrerpolicy.origin-when-cross-origin` オリジン・ウェン・クロス・オリジン	51	79	50		51
`html.elements.area.referrerpolicy.unsafe-url` 安全でないurl	51	79	50		51
`html.elements.iframe.referrerpolicy.no-referrer-when-downgrade` リファラーなし-ダウングレード時	51	79	50		51
`html.elements.iframe.referrerpolicy.origin-when-cross-origin` オリジン・ウェン・クロス・オリジン	51	79	50		51
`html.elements.iframe.referrerpolicy.unsafe-url` 安全でないurl	51	79	50		51
`html.elements.img.referrerpolicy.no-referrer-when-downgrade` リファラーなし-ダウングレード時	51	79	50		51
`html.elements.img.referrerpolicy.origin-when-cross-origin` オリジン・ウェン・クロス・オリジン	51	79	50		51
`html.elements.img.referrerpolicy.unsafe-url` 安全でないurl	51	79	50		51
`html.elements.link.referrerpolicy.no-referrer-when-downgrade` リファラーなし-ダウングレード時	51	79	50		51
`html.elements.link.referrerpolicy.origin-when-cross-origin` オリジン・ウェン・クロス・オリジン	51	79	50		51
`html.elements.link.referrerpolicy.unsafe-url` 安全でないurl	51	79	50		51
`html.elements.script.referrerpolicy.no-referrer-when-downgrade`	70	79	65		70
`html.elements.script.referrerpolicy.origin-when-cross-origin`	70	79	65		70
`html.elements.script.referrerpolicy.unsafe-url`	70	79	65		70
`http.headers.Referrer-Policy` HTTP の Referrer-Policy はresponse headerで、リファラー情報（Referer ヘッダーで送られる）をリクエストにどれだけ含めるかを制御します。 HTTP ヘッダーのほかに、 HTML でこのポリシーを設定することもできます。	56	79	50	11.1	56	12
`http.headers.Referrer-Policy.default_strict-origin-when-cross-origin` デフォルトのポリシーは `strict-origin-when-cross-origin` である。	85	85	87	15	85	15
`http.headers.Referrer-Policy.no-referrer-when-downgrade` リファラーなし-ダウングレード時	56	79	50	11.1	56	12
`http.headers.Referrer-Policy.origin-when-cross-origin` オリジン・ウェン・クロス・オリジン	56	79	50	11.1	56	12
`http.headers.Referrer-Policy.same-origin` 同祖	61	79	52	11.1	61	12
`http.headers.Referrer-Policy.strict-origin` ストリクト・オリジン	61	79	52	11.1	61	12
`http.headers.Referrer-Policy.strict-origin-when-cross-origin` ストリクト・オリジン・ウェン・クロス・オリジン	61	79	52	11.1	61	12
`http.headers.Referrer-Policy.unsafe-url` 安全でないurl	56	79	50	11.1	56	12

1+対応 (バージョン) 未対応 ※注釈ありサブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

基本構文

HTML

<meta name="referrer" content="strict-origin-when-cross-origin">

<a href="https://external.com" referrerpolicy="no-referrer">
  Links without a referrer
</a>

ライブデモ

Referrer policy matrix

Compare the amount of referrer information sent by common policies.

プレビュー全画面表示

Privacy trade-off

Explain how referrer policy balances analytics detail and cross-site privacy.

プレビュー全画面表示

Policy selection notes

Choose a default policy deliberately instead of relying on assumptions.

プレビュー全画面表示

実務での使いどころ

Referrer policy の活用

HTMLAnchorElement.referrerPolicy プロパティは、リソースの取得時に送信されるリファラーを定義する <a> 要素の HTML referrerpolicy 属性を反映します。

注意点

古いブラウザでは対応していない場合がある。

対応ブラウザ

基本構文

ライブデモ

Referrer policy matrix

Privacy trade-off

Policy selection notes

実務での使いどころ

Referrer policy の活用

注意点

アクセシビリティ

参考リンク