Hear from Slack, the ACLU, TED, & more at our customer summit in San Francisco Register
LOG IN SIGN UP
Documentation

チュートリアル: キャッシュ制御

  Last updated April 04, 2017

Fastly によるリソースのキャッシュ方法は完全に制御することができます。Fastly への指示として最も望ましいのは、バックエンド HTTP ヘッダーを使う方法です。他には、VCL (Varnish Configuration Language) を使用する方法があります。

バックエンド HTTP ヘッダー

オリジンサーバーで設定できる以下 4 種類の HTTP ヘッダーを通じて、Fastly のキャッシュサーバーおよび Web ブラウザにそれぞれ異なる挙動を設定することが出来ます。複数のヘッダーを設定した場合は、以下で先に説明されているものが優先されます。

Surrogate-Control

形式:

Surrogate-Control: max-age=(time in seconds)

例:

Surrogate-Control: max-age=3600

この例では、あるデータが Fastly のキャッシュサーバー上に 1 時間キャッシュされます。このヘッダーは削除されるため、Fastly のキャッシュサーバーにしか見えません。

Cache-Control: s-maxage

形式:

Cache-Control: s-maxage=(time in seconds)

これは Surrogate-Control と同様ですが、ヘッダーが削除されず、Fastly のキャッシュサーバー、および Fastly とブラウザ間のキャッシュサーバー (ブラウザ内のキャッシュを除く) がこのヘッダーに従う点が異なります。

Cache-Control: max-age

形式:

Cache-Control: max-age=(time in seconds)

Fastly のキャッシュサーバー、Fastly とブラウザ間のキャッシュサーバー、およびブラウザ自体がこのヘッダーに従います。

Expires

このヘッダーでは、指定された期限が切れるまでコンテンツがキャッシュされます。Fastly のキャッシュサーバー、Fastly とブラウザ間のキャッシュサーバー、およびブラウザ自体がこのヘッダーに従います。フォーマットの説明については 14.21 RFC2616 をお読みください。

キャッシュしない

特定のリソースをキャッシュしない場合、ヘッダを次のように設定します。

Cache-Control: private

事前に max-age=0 または Expires を設定しただけでは、あるタイミングにおける複数の未処理リクエストを処理するために、そのコンテンツが使用されないことは保証されません。また、エラーの場合や、バックエンドの同じオブジェクトへのリクエストをすでに処理中の場合に、期限切れの古いオブジェクトが使用される可能性があります。

Cache-Control や Surrogate-Control の両ヘッダーが指定された場合

仮に、自分のリソースを Fastly に永久的にキャッシュさせたいが、ブラウザがそのリソースをキャッシュさせたくないものとします (結果的に、ブラウザからは毎回 Fastly へのリクエストが生じますが、Fastly サービスではキャッシュミスが発生しません)。

これを実行する最良の方法は、Cache-ControlSurrogate-Control の両ヘッダーを Fastly へ送信することです。前者はブラウザに対する、後者は Fastly に対する指示となります。例えば、次のように設定します。

Cache-Control: no-cache, no-store, must-revalidate
Surrogate-Control: max-age=3600
Pragma: no-cache
Expires: 0

Cache-Control ヘッダーを private と設定した場合を除き、Surrogate-Control ヘッダーが Cache-Control より優先されます。ただし、Cache-Control とは異なり Surrogate-Control ヘッダーは削除されるので、ブラウザには見えません。

バックエンドの設定例

Apache の設定

Apache を使用している場合、ヘッダーを追加するには mod_expires モジュールを使用するのがもっとも簡単です。例えば、GIF 画像を、キャッシュサーバーが最後にアクセスしてから 75 分間キャッシュするには、次のようなディレクティブを VirtualHost の下に (またはグローバルに) 追加します。

ExpiresActive On
ExpiresByType image/gif "access plus 1 hours 15 minutes"

URL のサブツリー全体をキャッシュすることもできます。例えば、次のように設定します。

<Location "/css">
  ExpiresActive On
  ExpiresDefault "access plus 1 year"
</Location>

<Location "/static/">
  ExpiresActive On
  ExpiresDefault "access plus 1 day"
</Location>

NGINX の設定

NGINX を設定するには、expires ディレクティブを追加します。例えば、次のように設定します。

location ~* \.(js|css|png|jpg|jpeg|gif|ico)$ {
   expires 1h;
}

また、ヘッダーをより柔軟に変更する必要がある場合は、HttpHeadersMore モジュールを使用してみてください。

Amazon S3 の設定

S3 には、デフォルトでは複数のオブジェクトに Cache-Control ヘッダーを設定する機能はありません。そのため、S3Explorer を使ってファイル単位でヘッダーの設定を行うか、boto などのクラウドライブラリを使って自動化する必要があります。長いキャッシュ時間とインスタントパージを併用することで、パフォーマンスを向上できることを忘れないでください。

from boto.s3.connection import S3Connection

connection = S3Connection('aws access key', 'aws secret key')

buckets = connection.get_all_buckets()

for bucket in buckets:
    for key in bucket.list():
        print('%s' % key)

        if key.name.endswith('.jpg'):
            contentType = 'image/jpeg'
        elif key.name.endswith('.png'):
            contentType = 'image/png'
        else:
            continue

        key.metadata.update({
            'Content-Type': contentType,
            'Cache-Control': 'max-age=864000'
        })
        key.copy(
            key.bucket.name,
            key.name,
            key.metadata,
            preserve_acl=True
        )

プログラミング言語およびフレームワークを使った際のカスタムヘッダ

PHP

詳細: http://php.net/manual/ja/function.header.php

例: 特定の HTML を 1 時間キャッシュするには、出力を送信する前に下記のコードを追加します。

header('Cache-Control: max-age=3600');

Django

詳細: https://docs.djangoproject.com/en/dev/ref/request-response/#setting-headers

例:

response = HttpResponse()
response['Cache-Control'] = 'max-age=3600'

Sinatra

詳細: http://sinatra.rubyforge.org/doc/

例:

get '/' do
    headers['Cache-Control'] = 'max-age=3600'
end

Back to Top