このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

Sec-CH-Viewport-Height ヘッダー

安全なコンテキスト用: この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。

Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

HTTP は Sec-CH-Viewport-Height リクエストヘッダーは端末クライアントヒントで、クライアントのレイアウトビューポートの高さを CSS ピクセル単位で提供します。 値は、その上の最も小さな整数に丸められます(すなわち、切り上げとなります)。

このヒントは、他の画面特定ヒントと組み合わせて使用することで、特定の画面サイズに最適化された画像を配信したり、特定の画面の高さでは不要なリソースを省略したりすることができます。 メッセージ内に Sec-CH-Viewport-Height ヘッダーが複数回現れる場合、最後に現れたものが使用されます。

サーバーがクライアントから Sec-CH-Viewport-Height ヘッダーを受信するには、Accept-CH レスポンスヘッダーを送信して、この機能への参加を明示する必要があります。 この機能に参加するサーバーは、通常、Vary ヘッダーにもその旨を指定します。これにより、キャッシュに対して、サーバーがリクエストのヘッダー値に基づいて異なるレスポンスを送信することがあることが通知されます。

ヘッダー種別 リクエストヘッダー, クライアントヒント
禁止リクエストヘッダー いいえ

構文

http
Sec-CH-Viewport-Height: <number>

ディレクティブ

<number>

CSS ピクセル単位のユーザーのビューポートの高さを、最も近い整数に切り上げたものです。

例

Sec-CH-Viewport-Height の使用

サーバーが Sec-CH-Viewport-Height ヘッダーを受信するには、事前に、Accept-CH レスポンスヘッダーに Sec-CH-Viewport-Height レスポンスヘッダーを入れて送信し、オプトインしなければなりません。

http
Accept-CH: Sec-CH-Viewport-Height

その後のリクエストにおいて、クライアントは Sec-CH-Viewport-Height ヘッダーを送信する可能性があります。

http
Sec-CH-Viewport-Height: 480

仕様書

仕様書
Responsive Image Client Hints
# sec-ch-viewport-height

ブラウザーの互換性

関連情報