Sec-Fetch-Site ヘッダー
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2023年3月.
HTTP の Sec-Fetch-Site はフェッチメタデータリクエストヘッダーで、リクエストの発行元のオリジンと、リクエストされたリソースのオリジンとの関係を示します。
言い換えれば、このヘッダーは、リソースへのリクエストが同一オリジン、同一サイト、 別サイトのどれから来ているのか、あるいは「ユーザーが開始した」リクエストであるかをサーバーに指示します。サーバーはこの情報に基づいて、リクエストが許可されるべきか否かを判断することができます。
同一オリジンからのリクエストは通常デフォルトで許可されますが、別のオリジンからのリクエストについては、要求されているリソースや、別のフェッチメタデータリクエストヘッダー内の情報にさらに依存する可能性があります。デフォルトでは、受け入れられないリクエストは 403 レスポンスコードで拒否されるべきです。
| ヘッダー種別 | フェッチメタデータリクエストヘッダー |
|---|---|
| 禁止リクエストヘッダー | はい（Sec- 接頭辞） |
| CORS セーフリストリクエストヘッダー | いいえ |
構文
Sec-Fetch-Site: cross-site
Sec-Fetch-Site: same-origin
Sec-Fetch-Site: same-site
Sec-Fetch-Site: none
ディレクティブ
cross-site-
リクエストの送信元とリソースをホストしているサーバーのサイトが異なります（例 "potentially-evil.com" からの "example.com" 上のリソースへのリクエスト）。
same-origin-
リクエストの送信元とリソースをホストするサーバーのオリジンは同じです（同じスキーム、ホスト、ポート番号）。
same-site-
リクエストの発行元とリソースをホストするサーバーは、サイトがスキームを含めて同一です。
none-
このリクエストはユーザーが開始した操作です。例えば、アドレスバーへの URL 入力、ブックマークを開く操作、ファイルをブラウザーウィンドウへドラッグ＆ドロップする操作などです。
例
https://mysite.example のウェブページ（同じポート）から https://mysite.example/foo.json へのフェッチリクエストは、同一オリジンリクエストです。
ブラウザーは下記のように Sec-Fetch-Site: same-origin ヘッダーを生成し、サーバーは通常このリクエストを許可します。
GET /foo.json
Sec-Fetch-Dest: empty
Sec-Fetch-Mode: cors
Sec-Fetch-Site: same-origin
別のサイト（例えば potentially-evil.com）から同じ URL へフェッチリクエストを行うと、ブラウザーは異なるヘッダー（例えば Sec-Fetch-Site: cross-site）を発行します。サーバーはこのヘッダーを受け入れるか拒否するかを選択することが可能です。
GET /foo.json
Sec-Fetch-Dest: empty
Sec-Fetch-Mode: cors
Sec-Fetch-Site: cross-site
仕様書
| Specification |
|---|
| Fetch Metadata Request Headers # sec-fetch-site-header |
ブラウザーの互換性
Loading…
関連情報
- フェッチメタデータリクエストヘッダー:
Sec-Fetch-Mode,Sec-Fetch-User,Sec-Fetch-Dest - Protect your resources from web attacks with Fetch Metadata (web.dev)
- Fetch Metadata Request Headers playground (secmetadata.appspot.com)