圧縮ファイルを供給する - Amazon CloudFront

圧縮ファイルを供給する

リクエストされたオブジェクトを圧縮するとオブジェクトが小さくなるため、ダウンロード時間を短縮できます。場合によっては、元のサイズの 4 分の 1 未満になることがあります。特に、JavaScript および CSS ファイルでは、ダウンロードが速くなると、ビューワーにウェブページが表示されるまでの時間が短縮されます。さらに、CloudFront データ転送のコストは、供給されるデータの合計量に基づきます。圧縮ファイルを供給すると、非圧縮ファイルを供給するよりもコストが安くなる可能性があります。

オブジェクトを圧縮するように CloudFront を設定する

オブジェクトを圧縮するように CloudFront を設定するには、圧縮オブジェクトを供給するキャッシュ動作を更新します。

オブジェクトを圧縮するように CloudFront を設定するには (コンソール)
  1. CloudFront コンソールにサインインします。

  2. ディストリビューションを選択し、編集する [動作] を選択します。

  3. [オブジェクトを自動的に圧縮] 設定では、[はい] を選択します。

  4. キャッシュポリシーを使用してキャッシュ設定を指定し、[Gzip][Brotli] の両方の圧縮形式を有効にします。

  5. キャッシュポリシーの [TTL 設定] を 0 より大きい値に設定します。最小 TTL 値をゼロに設定すると、CloudFront は圧縮されたコンテンツをキャッシュしません。

メモ
  • Brotli 圧縮を使用するには、キャッシュポリシーを使用する必要があります。Brotli はレガシーキャッシュ設定をサポートしていません。

  • AWS CloudFormation または CloudFront API を使用して圧縮を有効にするには、CompressEnableAcceptEncodingGzipEnableAcceptEncodingBrotli パラメータを true に設定します。

CloudFront がオブジェクトを圧縮する方法を理解するには、次のセクションを参照してください。

CloudFront 圧縮の仕組み

  1. ビューワーがオブジェクトを要求する ビューワーにより Accept-Encoding HTTP ヘッダーがリクエストに含められます。ヘッダー値には gzipbr、またはその両方が含められます。これは、ビューワーが圧縮オブジェクトをサポートすることを示します。ビューワーが Gzip と Brotli の両方をサポートしている場合、CloudFront では Brotli を使用します。

    注記

    ウェブブラウザ Chrome および Firefox では、HTTPS を使用してリクエストを送信する場合のみ、Brotli 圧縮をサポートします。これらのブラウザでは、HTTP リクエストでの Brotli はサポートしていません。

  2. CloudFront では、エッジロケーションで、リクエストされたオブジェクトの圧縮コピーのキャッシュを確認します。

  3. 圧縮オブジェクトがキャッシュにあるかどうかに応じて、CloudFront は次のいずれかを実行します。

    • 圧縮オブジェクトが既にキャッシュにある場合、CloudFront ではそのオブジェクトをビューワーに送信し、残りの手順をスキップします。

    • 圧縮オブジェクトがキャッシュにない場合、CloudFront がリクエストをオリジンに転送します。

    注記

    オブジェクトの非圧縮のコピーがすでにキャッシュにある場合、CloudFront はリクエストをオリジンに転送せずにビューワーに送信することがあります。例えば、CloudFront が以前に圧縮をスキップした場合に、この現象が起こる可能性があります。この場合、CloudFront では非圧縮オブジェクトをキャッシュし、オブジェクトが有効期限切れになるか、削除されるか、あるいは無効になるまで、処理を継続します。

  4. オリジンが圧縮オブジェクトを返す場合 (HTTP レスポンスの Content-Encoding ヘッダーに示されているように)、CloudFront では圧縮オブジェクトをビューワーに送信し、それをキャッシュに追加して、残りの手順をスキップします。CloudFront では、オブジェクトを再度圧縮することはありません。

  5. オリジンが HTTP レスポンスに Content-Encoding ヘッダーがない状態で CloudFront に非圧縮オブジェクトを返す場合、CloudFront ではオブジェクトが圧縮可能かどうかを判断します。詳細については、「CloudFront がオブジェクトを圧縮する場合」を参照してください。

  6. オブジェクトが圧縮できる場合、CloudFront ではオブジェクトを圧縮して、それをビューワーに送信し、キャッシュに追加します。

  7. 以降、同じオブジェクトに対するビューワーリクエストがある場合、CloudFront は最初のキャッシュ済みバージョンを返します。例えば、ビューワーが Gzip 圧縮を使用する特定のキャッシュされたオブジェクトをリクエストして、ビューワーが Gzip 形式を受け入れると、ビューワーが Brotli と Gzip の両方を受け入れる場合でも、同じオブジェクトに対する以降のリクエストには常に Gzip バージョンが返されます。

一部のカスタムオリジンでは、オブジェクトを圧縮することもできます。オリジンでは、CloudFront で圧縮されないオブジェクトを圧縮できる場合があります。詳細については、「CloudFront が圧縮するファイルタイプ」を参照してください。

CloudFront がオブジェクトを圧縮する場合

CloudFront でオブジェクトを圧縮するタイミングの詳細については、次のリストを参照してください。

リクエストで HTTP 1.0 が使用される

CloudFront へのリクエストで HTTP 1.0 が使用される場合、CloudFront では Accept-Encoding ヘッダーを削除し、レスポンスのオブジェクトを圧縮しません。

Accept-Encoding リクエストヘッダー

ビューワーリクエストに Accept-Encoding ヘッダーがない場合、またはヘッダーに gzip または br が値として含まれていない場合、CloudFront ではレスポンスのオブジェクトを圧縮しません。Accept-Encoding ヘッダーに追加の値 (deflate など) が含まれる場合、CloudFront ではそれらを削除してからリクエストをオリジンに転送します。

CloudFront がオブジェクトを圧縮するように設定されている場合、キャッシュキーとオリジンリクエストに Accept-Encoding ヘッダーが自動的に含められます。

オブジェクトが圧縮されるように CloudFront を設定すると、コンテンツがすでにキャッシュされている

CloudFront では、オブジェクトをオリジンから取得したときにそのオブジェクトを圧縮します。オブジェクトが圧縮されるように CloudFront を設定した場合、CloudFront では、すでにエッジロケーションでキャッシュされたオブジェクトを圧縮しません。さらに、キャッシュされたオブジェクトがエッジロケーションで有効期限切れになり、CloudFront でオブジェクトに対する別のリクエストをオリジンに転送した場合に、HTTP ステータスコード 304 がオリジンから返されると、CloudFront ではファイルを圧縮しません。つまり、エッジロケーションには既に最新バージョンのオブジェクトがあります。エッジロケーションですでにキャッシュされているオブジェクトを CloudFront で圧縮するには、これらのオブジェクトを無効にする必要があります。詳細については、「ファイルを無効化してコンテンツを削除する」を参照してください。

オブジェクトが圧縮されるようにオリジンがすでに設定されている

オブジェクトが圧縮されるように CloudFront を設定し、オリジンでもオブジェクトが圧縮される場合、オリジンには Content-Encoding ヘッダーが含まれている必要があります。このヘッダーは、オブジェクトが既に圧縮されていることを CloudFront に示します。オリジンからのレスポンスに Content-Encoding ヘッダーが含まれる場合、ヘッダーの値に関係なく CloudFront ではオブジェクトを圧縮しません。CloudFront ではレスポンスをビューワーに送信し、エッジロケーションでオブジェクトをキャッシュします。

CloudFront が圧縮するファイルタイプ

詳細な一覧については、「CloudFront が圧縮するファイルタイプ」を参照してください。

CloudFront で圧縮するオブジェクトのサイズ

CloudFront では サイズが 1,000~10,000,000 バイトのオブジェクトを圧縮します。

Content-Length ヘッダー

オリジンは、レスポンスに Content-Length ヘッダーを含める必要があります。これは、オブジェクトのサイズが CloudFront で圧縮できる範囲にあるかどうかを判断するために使用されるものです。Content-Length ヘッダーがない、無効な値が含まれている、または CloudFront で圧縮できるサイズの範囲外の値が含まれている場合、CloudFront はオブジェクトを圧縮しません。CloudFront がサイズ範囲を超える可能性のある大きなオブジェクトを処理する方法の詳細については、「CloudFront がオブジェクトの部分的リクエスト (レンジ GET) を処理する方法」を参照してください。

レスポンスの HTTP ステータスコード

CloudFront では、レスポンスの HTTP ステータスコードが 200403、または 404 の場合にのみ、オブジェクトが圧縮されます。

レスポンスに本文がない

オリジンからの HTTP レスポンスに本文がない場合、CloudFront で圧縮するものはありません。

ETag ヘッダー

CloudFront では、オブジェクトを圧縮するときに HTTP レスポンスの ETag ヘッダーを変更することがあります。詳細については、「ETag ヘッダーの変換」を参照してください。

CloudFront が圧縮をスキップする

CloudFront はベストエフォートベースでオブジェクトを圧縮します。まれに、CloudFront のトラフィック負荷が高い場合、CloudFront はオブジェクトの圧縮をスキップします。CloudFront は、ホスト容量を含むさまざまな要因に基づいて、この決定を行います。CloudFront がオブジェクトの圧縮をスキップした場合、非圧縮オブジェクトをキャッシュし、オブジェクトが有効期限切れになるか、削除されるか、無効になるまで、処理を継続します。

CloudFront が圧縮するファイルタイプ

オブジェクトが圧縮されるように CloudFront を設定すると、CloudFront が Content-Type レスポンスヘッダーに次の値を持つオブジェクトだけを圧縮します。

  • application/dash+xml

  • application/eot

  • application/font

  • application/font-sfnt

  • application/javascript

  • application/json

  • application/opentype

  • application/otf

  • application/pdf

  • application/pkcs7-mime

  • application/protobuf

  • application/rss+xml

  • application/truetype

  • application/ttf

  • application/vnd.apple.mpegurl

  • application/vnd.mapbox-vector-tile

  • application/vnd.ms-fontobject

  • application/wasm

  • application/xhtml+xml

  • application/xml

  • application/x-font-opentype

  • application/x-font-truetype

  • application/x-font-ttf

  • application/x-httpd-cgi

  • application/x-javascript

  • application/x-mpegurl

  • application/x-opentype

  • application/x-otf

  • application/x-perl

  • application/x-ttf

  • font/eot

  • font/opentype

  • font/otf

  • font/ttf

  • image/svg+xml

  • text/css

  • text/csv

  • text/html

  • text/javascript

  • text/js

  • text/plain

  • text/richtext

  • text/tab-separated-values

  • text/xml

  • text/x-component

  • text/x-java-source

  • text/x-script

  • vnd.apple.mpegurl

ETag ヘッダーの変換

オリジンからの非圧縮オブジェクトに有効な強い ETag HTTP ヘッダーが含まれていて、CloudFront でそのオブジェクトを圧縮する場合、CloudFront では強い ETag ヘッダー値を弱い ETag に変換し、ビューワーに弱い ETag 値を返します。ビューワーは、弱い ETag 値を格納し、それを使用して If-None-Match HTTP ヘッダーで条件付きリクエストを送信できます。これにより、ビューワー、CloudFront、およびオリジンは、オブジェクトの圧縮バージョンと非圧縮バージョンを意味的に同等なものとして扱い、不要なデータ転送を減らすことができます。

有効な強い ETag ヘッダー値は、二重引用符 (") で開始および終了します。強い ETag 値を弱い値に変換するために、CloudFront は強い W/ 値の先頭に文字 ETag を追加します。

オリジンからのオブジェクトに弱い ETag ヘッダー値 (文字 W/ で始まる値) が含まれている場合、CloudFront はこの値を変更せず、オリジンから受け取ったままビューワーに返します。

オリジンからのオブジェクトに無効な ETag ヘッダー値が含まれている場合 (値が " または W/ で始まらない)、CloudFront は ETag ヘッダーを削除し、ETag レスポンスヘッダーなしでオブジェクトをビューワーに返します。

詳細については、MDN ウェブドキュメントの以下のページを参照してください。