入門
基礎
ドメインと起源
性能

構成
ヘッダー
反応
性能
パージ
カスタムVCL
画像の最適化
ビデオ

セキュリティ
Access control lists
モニタリングとテスト
セキュアな通信
TLS
Web アプリケーションファイアウォール (WAF)

診断
ログのストリーム配信
デバッグ手法
一般的なエラー

アカウント情報
課金

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

      Last updated January 09, 2019

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

    バックエンド HTTP ヘッダー

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

    Surrogate-Control

    形式:

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

    例:

    1
    
    Surrogate-Control: max-age=3600
    

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

    Cache-Control: s-maxage

    形式:

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

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

    Cache-Control: max-age

    形式:

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

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

    Expires

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

    キャッシュしない

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

    1
    
    Cache-Control: private
    

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

    Fastly と ブラウザに異なるキャッシュルールを適用する方法

    仮に、自分のリソースを Fastly に永久的にキャッシュさせたいが、ブラウザがそのリソースをキャッシュさせたくないものとします。これを実行する最良の方法は、Cache-ControlSurrogate-Control の両ヘッダーを Fastly へ送信することです。前者はブラウザに対する、後者は Fastly に対する指示となります。例えば、次のように設定します。

    1
    2
    
    Cache-Control: no-store, must-revalidate
    Surrogate-Control: max-age=3600
    

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

    Web サーバーの設定方法

    Apache の設定

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

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

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

    1
    2
    3
    4
    5
    6
    7
    8
    9
    
    <Location "/css">
      ExpiresActive On
      ExpiresDefault "access plus 1 year"
    </Location>
    
    <Location "/static/">
      ExpiresActive On
      ExpiresDefault "access plus 1 day"
    </Location>
    

    NGINX の設定

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

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

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

    Amazon S3 の設定

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

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    
    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

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

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

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

    Django

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

    例:

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

    Sinatra

    詳細: http://sinatrarb.com/documentation.html

    例:

    1
    2
    3
    
    get '/' do
        headers['Cache-Control'] = 'max-age=3600'
    end
    
    Back to Top