Client Hints

注意： ch パラメータは、Imgixのキャッシュインフラとの相互作用のため、Sourceのデフォルトパラメータとして設定することはできません。

ch パラメータを使用すると、特定の画像で Client Hints を利用できるようになります。これにより、ブラウザのヘッダーを使用して自動的に最適なリソースが選択されます。Imgix は現在、以下の3つのヒントをサポートしており、それぞれの Imgix パラメータを上書きまたは変更します：

• Width は Imgix の w パラメータを上書きします
• DPR は Imgix の dpr パラメータを上書きします
• Save-Data は画質を q=45 に低下させ、画像の出力形式が変更される場合があります

複数の Client Hint を使用することが可能です。値はカンマで区切って指定します。ブラウザが Client Hints をサポートしていない場合は、URLに含まれる他の値が使用されます。たとえば、以下のURLは Width と DPR の Client Hint が存在する場合はそれを利用し、サポートされていない場合は幅400の2DPR画像を返します：

https://assets.imgix.net/unsplash/bear.jpg?ch=Width,DPR&w=400&dpr=2

注意： Save-Data をサポートするすべてのブラウザは、このヘッダーを常に送信します。Client Hint の meta タグが存在するかどうかは関係ありません。ただし、他の Client Hints を使用するには、以下のような <meta> タグをサイトに含める必要があります：

<meta http-equiv="Accept-CH" content="Width,DPR">

Client Hints が実際に送信され、利用されるようにするには、オリジンサーバーまたはCDNの構成で以下のレスポンスヘッダーも返す必要があります：

Accept-CH: DPR, Width, Save-Data
Vary: Accept, DPR, Width, Save-Data

• Accept-CH は、ブラウザがどの Client Hints を送信すべきかを指定します。
• Vary は、これらのヘッダーに基づいてキャッシュを分けるように指示します。

これらのヘッダーはHTTPS経由で返される必要があり、Imgix の画像URLと同じオリジンである必要があります。CDNやプロキシを使用している場合は、これらのヘッダーが Imgix に適切に転送されるよう構成してください。

さらに詳細やユースケースについては以下を参照してください：

• Client Hints によるレスポンシブデザイン
• Save-Data による高速画像配信