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

圧縮ファイルを供給する

CloudFront を使用して、特定のタイプのオブジェクト (ファイル) を自動的に圧縮し、ビューワー (ウェブブラウザやその他のクライアント) でサポートされている場合は、その圧縮オブジェクトを供給できます。ビューワーが Accept-Encoding HTTP ヘッダーを含む圧縮オブジェクトのサポートの可否を示します。

CloudFront では、Gzip および Brotli 圧縮形式を使用してオブジェクトを圧縮できます。ビューワーが両方の形式をサポートしていて、アクセス先のキャッシュサーバーに両方が存在する場合、CloudFront は Brotli を優先します。キャッシュサーバーに圧縮形式が 1 つしかない場合、CloudFront はそれを返します。

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

注記

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

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

一部のカスタムオリジンでは、オブジェクトを圧縮することもできます。オリジンでは、CloudFront で圧縮されないオブジェクトを圧縮できる場合があります (「CloudFront が圧縮するファイルタイプ」を参照)。オリジンが圧縮オブジェクトを CloudFront に返す場合、CloudFront ではオブジェクトが Content-Encoding ヘッダーの存在に基づいて圧縮されていることを検出し、オブジェクトを再度圧縮することはありません。

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

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

  1. [オブジェクトを自動的に圧縮する] 設定がはいになっていることを確認します。(AWS CloudFormation または CloudFront API で、Compresstrue に設定します)。

  2. キャッシュポリシーを使用してキャッシュ設定を指定し、GzipBrotli の設定がどちらも有効になっていることを確認します。(AWS CloudFormation または CloudFront API で、EnableAcceptEncodingGzipEnableAcceptEncodingBrotlitrue に設定します)。

  3. キャッシュポリシーの TTL 値が 0 より大きい値に設定されていることを確認します。TTL 値をゼロに設定すると、圧縮されたコンテンツのキャッシュは無効になります。

キャッシュ動作を更新するには、次のいずれかのツールを使用できます。

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 では非圧縮オブジェクトをキャッシュし、オブジェクトが有効期限切れになるか、削除されるか、あるいは無効になるまで、処理を継続します。

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

    オリジンが CloudFront に非圧縮オブジェクトを返す場合 (HTTP レスポンスに Content-Encoding ヘッダーがない)、CloudFront ではオブジェクトが圧縮可能かどうかを判断します。CloudFront でオブジェクトが圧縮可能かどうかを判断する方法の詳細については、次のセクションをご覧ください。

  5. オブジェクトが圧縮可能な場合、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 では、すでにエッジロケーションでキャッシュされたオブジェクトを圧縮しません。さらに、キャッシュされたオブジェクトがエッジロケーションで有効期限切れになり、CloudFront でオブジェクトに対する別のリクエストをオリジンに転送した場合に、HTTP ステータスコード 304 (エッジロケーションにすでにオブジェクトの最新バージョンがあることを意味する) がオリジンから返されると、CloudFront ではファイルを圧縮しません。エッジロケーションですでにキャッシュされているオブジェクトを CloudFront で圧縮するには、これらのオブジェクトを無効にする必要があります。詳細については、「ファイルを無効化してコンテンツを削除する」を参照してください。

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

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

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

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

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

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

Content-Length ヘッダー

オリジンは、レスポンスに Content-Length ヘッダーを含める必要があります。これは、オブジェクトのサイズが CloudFront で圧縮できる範囲にあるかどうかを判断するために使用されるものです。Content-Length ヘッダーがない、無効な値が含まれている、または CloudFront で圧縮できるサイズの範囲外の値が含まれている場合、CloudFront はオブジェクトを圧縮しません。

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

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

レスポンスに本文がない

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

ETag ヘッダー

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

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 ウェブドキュメントの以下のページを参照してください。