# /etc/nginx/conf.d/cache-headers.conf
# オリジンサーバー側でのキャッシュ制御ヘッダー設定
 
server {
    listen 443 ssl http2;
    server_name api.example.com;
 
    # --- 静的アセット（ハッシュ付きファイル名） ---
    # app.a1b2c3d4.js, style.e5f6g7h8.css のようなファイル
    location ~* \.[a-f0-9]{8}\.(js|css|woff2?|ttf|eot|svg|png|jpg|webp|avif)$ {
        # 1年間キャッシュ + 不変宣言
        add_header Cache-Control "public, max-age=31536000, immutable";
        add_header CDN-Cache-Control "max-age=31536000";
 
        # CORSヘッダー（フォント等で必要）
        add_header Access-Control-Allow-Origin "*";
 
        # ETag は不要（immutableのため）
        etag off;
    }
 
    # --- 通常の静的ファイル（ハッシュなし） ---
    location ~* \.(ico|gif|bmp)$ {
        add_header Cache-Control "public, max-age=86400, stale-while-revalidate=604800";
        etag on;
    }
 
    # --- HTML ファイル ---
    location ~* \.html$ {
        # CDNでは5分キャッシュ、ブラウザでは毎回再検証
        add_header Cache-Control "public, s-maxage=300, max-age=0, must-revalidate";
        add_header CDN-Cache-Control "max-age=300, stale-while-revalidate=60";
        etag on;
    }
 
    # --- API レスポンス ---
    location /api/ {
        # CDNでは30秒キャッシュ、ブラウザではキャッシュしない
        add_header Cache-Control "public, s-maxage=30, max-age=0, no-cache";
        add_header Vary "Accept, Accept-Encoding, Authorization";
 
        # パージ用のサロゲートキー
        add_header Surrogate-Key "api-response";
 
        proxy_pass http://backend;
    }
 
    # --- ユーザー固有データ ---
    location /api/me/ {
        # CDNキャッシュ禁止
        add_header Cache-Control "private, no-store, max-age=0";
        proxy_pass http://backend;
    }
 
    # --- エラーページ ---
    location = /error.html {
        # オリジンダウン時にCDNが古いキャッシュを返す
        add_header Cache-Control "public, max-age=60, stale-if-error=86400";
    }
}

# cloudfront.tf
# AWS CloudFront Distribution の Terraform 設定
 
# --- S3 オリジン用のOAC（Origin Access Control） ---
resource "aws_cloudfront_origin_access_control" "s3_oac" {
  name                              = "s3-oac-${var.environment}"
  description                       = "OAC for S3 static assets"
  origin_access_control_origin_type = "s3"
  signing_behavior                  = "always"
  signing_protocol                  = "sigv4"
}
 
# --- キャッシュポリシー ---
resource "aws_cloudfront_cache_policy" "static_assets" {
  name        = "static-assets-${var.environment}"
  comment     = "Cache policy for immutable static assets"
  default_ttl = 86400      # 1日
  max_ttl     = 31536000   # 1年
  min_ttl     = 0
 
  parameters_in_cache_key_and_forwarded_to_origin {
    cookies_config {
      cookie_behavior = "none"  # Cookieをキャッシュキーに含めない
    }
    headers_config {
      header_behavior = "none"  # ヘッダーをキャッシュキーに含めない
    }
    query_strings_config {
      query_string_behavior = "none"  # クエリ文字列をキャッシュキーに含めない
    }
    enable_accept_encoding_gzip  = true   # gzip圧縮版を自動キャッシュ
    enable_accept_encoding_brotli = true  # Brotli圧縮版を自動キャッシュ
  }
}
 
resource "aws_cloudfront_cache_policy" "dynamic_content" {
  name        = "dynamic-content-${var.environment}"
  comment     = "Cache policy for API and dynamic content"
  default_ttl = 30    # 30秒
  max_ttl     = 300   # 5分
  min_ttl     = 0
 
  parameters_in_cache_key_and_forwarded_to_origin {
    cookies_config {
      cookie_behavior = "none"
    }
    headers_config {
      header_behavior = "whitelist"
      headers {
        items = ["Accept", "Accept-Language"]
      }
    }
    query_strings_config {
      query_string_behavior = "whitelist"
      query_strings {
        items = ["page", "limit", "category", "lang"]
      }
    }
    enable_accept_encoding_gzip   = true
    enable_accept_encoding_brotli = true
  }
}
 
# --- オリジンリクエストポリシー ---
resource "aws_cloudfront_origin_request_policy" "api_forward" {
  name    = "api-forward-${var.environment}"
  comment = "Forward necessary headers to API origin"
 
  cookies_config {
    cookie_behavior = "all"  # 全Cookieをオリジンに転送
  }
  headers_config {
    header_behavior = "whitelist"
    headers {
      items = [
        "Accept",
        "Accept-Language",
        "Authorization",
        "Content-Type",
        "Origin",
        "Referer",
        "X-Request-ID"
      ]
    }
  }
  query_strings_config {
    query_string_behavior = "all"  # 全クエリをオリジンに転送
  }
}
 
# --- レスポンスヘッダーポリシー ---
resource "aws_cloudfront_response_headers_policy" "security_headers" {
  name    = "security-headers-${var.environment}"
  comment = "Security headers for all responses"
 
  security_headers_config {
    strict_transport_security {
      access_control_max_age_sec = 31536000
      include_subdomains         = true
      preload                    = true
      override                   = true
    }
    content_type_options {
      override = true  # X-Content-Type-Options: nosniff
    }
    frame_options {
      frame_option = "DENY"
      override     = true
    }
    xss_protection {
      mode_block = true
      protection = true
      override   = true
    }
    referrer_policy {
      referrer_policy = "strict-origin-when-cross-origin"
      override        = true
    }
    content_security_policy {
      content_security_policy = "default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; img-src 'self' data: https:; font-src 'self' https://fonts.gstatic.com"
      override                = true
    }
  }
 
  custom_headers_config {
    items {
      header   = "Permissions-Policy"
      override = true
      value    = "camera=(), microphone=(), geolocation=()"
    }
    items {
      header   = "X-CDN-Pop"
      override = false
      value    = ""  # CloudFrontが自動でPoP情報を付与
    }
  }
}
 
# --- メインDistribution ---
resource "aws_cloudfront_distribution" "main" {
  enabled             = true
  is_ipv6_enabled     = true
  http_version        = "http2and3"  # HTTP/3 (QUIC) を有効化
  price_class         = "PriceClass_200"  # 北米+欧州+アジア+中東+アフリカ
  default_root_object = "index.html"
  comment             = "Main distribution - ${var.environment}"
  aliases             = [var.domain_name]
 
  # --- S3 オリジン（静的アセット） ---
  origin {
    domain_name              = aws_s3_bucket.static_assets.bucket_regional_domain_name
    origin_id                = "s3-static"
    origin_access_control_id = aws_cloudfront_origin_access_control.s3_oac.id
    origin_shield {
      enabled              = true
      origin_shield_region = "ap-northeast-1"  # 東京リージョン
    }
  }
 
  # --- ALB オリジン（API） ---
  origin {
    domain_name = aws_lb.api.dns_name
    origin_id   = "alb-api"
    custom_origin_config {
      http_port              = 80
      https_port             = 443
      origin_protocol_policy = "https-only"
      origin_ssl_protocols   = ["TLSv1.2"]
      origin_read_timeout    = 30
    }
    custom_header {
      name  = "X-Origin-Verify"
      value = var.origin_verify_secret
    }
  }
 
  # --- デフォルトビヘイビア（S3静的アセット） ---
  default_cache_behavior {
    target_origin_id           = "s3-static"
    viewer_protocol_policy     = "redirect-to-https"
    allowed_methods            = ["GET", "HEAD", "OPTIONS"]
    cached_methods             = ["GET", "HEAD"]
    compress                   = true
    cache_policy_id            = aws_cloudfront_cache_policy.static_assets.id
    response_headers_policy_id = aws_cloudfront_response_headers_policy.security_headers.id
 
    # CloudFront Functions でURLリライト
    function_association {
      event_type   = "viewer-request"
      function_arn = aws_cloudfront_function.url_rewrite.arn
    }
  }
 
  # --- APIビヘイビア ---
  ordered_cache_behavior {
    path_pattern               = "/api/*"
    target_origin_id           = "alb-api"
    viewer_protocol_policy     = "https-only"
    allowed_methods            = ["GET", "HEAD", "OPTIONS", "PUT", "POST", "PATCH", "DELETE"]
    cached_methods             = ["GET", "HEAD"]
    compress                   = true
    cache_policy_id            = aws_cloudfront_cache_policy.dynamic_content.id
    origin_request_policy_id   = aws_cloudfront_origin_request_policy.api_forward.id
    response_headers_policy_id = aws_cloudfront_response_headers_policy.security_headers.id
  }
 
  # --- ハッシュ付きアセット専用ビヘイビア ---
  ordered_cache_behavior {
    path_pattern           = "/assets/*"
    target_origin_id       = "s3-static"
    viewer_protocol_policy = "redirect-to-https"
    allowed_methods        = ["GET", "HEAD"]
    cached_methods         = ["GET", "HEAD"]
    compress               = true
    cache_policy_id        = aws_cloudfront_cache_policy.static_assets.id
  }
 
  # --- SSL証明書 ---
  viewer_certificate {
    acm_certificate_arn      = var.acm_certificate_arn
    ssl_support_method       = "sni-only"
    minimum_protocol_version = "TLSv1.2_2021"
  }
 
  # --- WAF ---
  web_acl_id = var.waf_web_acl_arn
 
  # --- アクセスログ ---
  logging_config {
    include_cookies = false
    bucket          = aws_s3_bucket.cf_logs.bucket_domain_name
    prefix          = "cloudfront/${var.environment}/"
  }
 
  # --- カスタムエラーレスポンス（SPA対応） ---
  custom_error_response {
    error_code            = 404
    response_code         = 200
    response_page_path    = "/index.html"
    error_caching_min_ttl = 10
  }
 
  custom_error_response {
    error_code            = 403
    response_code         = 200
    response_page_path    = "/index.html"
    error_caching_min_ttl = 10
  }
 
  restrictions {
    geo_restriction {
      restriction_type = "none"
    }
  }
 
  tags = {
    Environment = var.environment
    ManagedBy   = "terraform"
  }
}
 
# --- CloudFront Functions（URLリライト） ---
resource "aws_cloudfront_function" "url_rewrite" {
  name    = "url-rewrite-${var.environment}"
  runtime = "cloudfront-js-2.0"
  comment = "Rewrite URLs for SPA routing"
  publish = true
  code    = file("${path.module}/functions/url-rewrite.js")
}

// functions/url-rewrite.js
// CloudFront Functions: SPA用URLリライトとセキュリティヘッダー付与
 
function handler(event) {
    var request = event.request;
    var uri = request.uri;
    var headers = request.headers;
 
    // --- トレーリングスラッシュの正規化 ---
    // /about/ → /about （ただしルートは除外）
    if (uri.length > 1 && uri.endsWith('/')) {
        return {
            statusCode: 301,
            statusDescription: 'Moved Permanently',
            headers: {
                'location': { value: uri.slice(0, -1) },
                'cache-control': { value: 'max-age=3600' }
            }
        };
    }
 
    // --- 拡張子がないパスをSPAルートとしてindex.htmlに書き換え ---
    // /about, /products/123 → /index.html
    // /style.css, /app.js → そのまま
    if (!uri.includes('.')) {
        request.uri = '/index.html';
    }
 
    // --- セキュリティ: パストラバーサル防止 ---
    if (uri.includes('..') || uri.includes('//')) {
        return {
            statusCode: 400,
            statusDescription: 'Bad Request',
            headers: {
                'content-type': { value: 'text/plain' }
            },
            body: 'Invalid request path'
        };
    }
 
    // --- Accept-Language に基づく言語リダイレクト ---
    if (uri === '/index.html' || uri === '/') {
        var acceptLang = headers['accept-language']
            ? headers['accept-language'].value : '';
        if (acceptLang.startsWith('ja')) {
            request.uri = '/ja/index.html';
        }
    }
 
    return request;
}

#!/bin/bash
# scripts/cloudfront-invalidate.sh
# CloudFront キャッシュ無効化スクリプト
 
DISTRIBUTION_ID="${CF_DISTRIBUTION_ID:?'CF_DISTRIBUTION_ID is required'}"
 
# --- 個別パスの無効化 ---
invalidate_paths() {
    local paths=("$@")
    echo "Invalidating ${#paths[@]} paths on distribution ${DISTRIBUTION_ID}..."
 
    aws cloudfront create-invalidation \
        --distribution-id "${DISTRIBUTION_ID}" \
        --paths "${paths[@]}" \
        --output json | jq '{
            InvalidationId: .Invalidation.Id,
            Status: .Invalidation.Status,
            Paths: .Invalidation.InvalidationBatch.Paths.Items,
            CreateTime: .Invalidation.CreateTime
        }'
}
 
# --- デプロイ後の標準無効化パターン ---
deploy_invalidation() {
    echo "=== Post-Deploy Invalidation ==="
 
    # HTMLファイルとサービスワーカーのみ無効化
    # （ハッシュ付き静的ファイルは無効化不要）
    invalidate_paths \
        "/index.html" \
        "/ja/index.html" \
        "/en/index.html" \
        "/sw.js" \
        "/manifest.json" \
        "/robots.txt" \
        "/sitemap.xml"
}
 
# --- 無効化の完了待ち ---
wait_for_invalidation() {
    local invalidation_id="$1"
    echo "Waiting for invalidation ${invalidation_id} to complete..."
 
    aws cloudfront wait invalidation-completed \
        --distribution-id "${DISTRIBUTION_ID}" \
        --id "${invalidation_id}"
 
    echo "Invalidation ${invalidation_id} completed."
}
 
# --- 全キャッシュクリア（緊急時のみ） ---
purge_all() {
    echo "WARNING: Purging ALL cache for distribution ${DISTRIBUTION_ID}"
    read -p "Are you sure? (yes/no): " confirm
    if [ "$confirm" = "yes" ]; then
        invalidate_paths "/*"
    else
        echo "Aborted."
    fi
}
 
# --- メイン ---
case "${1}" in
    deploy)  deploy_invalidation ;;
    purge)   purge_all ;;
    paths)   shift; invalidate_paths "$@" ;;
    *)       echo "Usage: $0 {deploy|purge|paths <path1> <path2> ...}" ;;
esac

# scripts/cloudfront_invalidate.py
# Python SDK (boto3) を使ったプログラマティックな無効化
 
import boto3
import time
from datetime import datetime
from typing import List, Optional
 
class CloudFrontInvalidator:
    """CloudFront キャッシュ無効化ユーティリティ"""
 
    def __init__(self, distribution_id: str, region: str = "us-east-1"):
        self.distribution_id = distribution_id
        self.client = boto3.client("cloudfront", region_name=region)
 
    def invalidate(self, paths: List[str]) -> dict:
        """指定パスのキャッシュを無効化"""
        caller_reference = f"inv-{datetime.utcnow().strftime('%Y%m%d%H%M%S')}"
 
        response = self.client.create_invalidation(
            DistributionId=self.distribution_id,
            InvalidationBatch={
                "Paths": {
                    "Quantity": len(paths),
                    "Items": paths,
                },
                "CallerReference": caller_reference,
            },
        )
 
        invalidation = response["Invalidation"]
        return {
            "id": invalidation["Id"],
            "status": invalidation["Status"],
            "paths": paths,
            "created": invalidation["CreateTime"].isoformat(),
        }
 
    def wait_for_completion(
        self, invalidation_id: str, timeout: int = 600
    ) -> bool:
        """無効化の完了を待機（デフォルト10分タイムアウト）"""
        waiter = self.client.get_waiter("invalidation_completed")
        try:
            waiter.wait(
                DistributionId=self.distribution_id,
                Id=invalidation_id,
                WaiterConfig={
                    "Delay": 10,
                    "MaxAttempts": timeout // 10,
                },
            )
            return True
        except Exception as e:
            print(f"Timeout waiting for invalidation: {e}")
            return False
 
    def deploy_invalidation(self) -> dict:
        """デプロイ後の標準無効化"""
        standard_paths = [
            "/index.html",
            "/sw.js",
            "/manifest.json",
            "/robots.txt",
            "/sitemap.xml",
        ]
        return self.invalidate(standard_paths)
 
 
# 使用例
if __name__ == "__main__":
    invalidator = CloudFrontInvalidator("E1234567890ABC")
    result = invalidator.deploy_invalidation()
    print(f"Invalidation created: {result['id']}")
    invalidator.wait_for_completion(result["id"])

// workers/edge-api-cache.js
// Cloudflare Workers: APIレスポンスのインテリジェントキャッシュ
 
/**
 * エッジでAPIレスポンスをキャッシュし、
 * stale-while-revalidate パターンを実装するWorker
 */
 
const CACHE_CONFIG = {
  // パスパターンごとのキャッシュ設定
  '/api/products': { ttl: 300, swr: 600, tags: ['products'] },
  '/api/categories': { ttl: 3600, swr: 7200, tags: ['categories'] },
  '/api/search': { ttl: 60, swr: 120, tags: ['search'] },
};
 
export default {
  async fetch(request, env, ctx) {
    const url = new URL(request.url);
 
    // --- POST/PUT/DELETE はキャッシュしない ---
    if (request.method !== 'GET') {
      return handleMutation(request, env);
    }
 
    // --- キャッシュ設定の取得 ---
    const cacheConfig = getCacheConfig(url.pathname);
    if (!cacheConfig) {
      // キャッシュ対象外のパスはそのままオリジンへ
      return fetch(request);
    }
 
    // --- Cache APIでキャッシュ確認 ---
    const cache = caches.default;
    const cacheKey = new Request(url.toString(), {
      method: 'GET',
      headers: { 'Accept': request.headers.get('Accept') || 'application/json' },
    });
 
    let response = await cache.match(cacheKey);
 
    if (response) {
      // --- キャッシュヒット ---
      const age = getAge(response);
      const isStale = age > cacheConfig.ttl;
 
      if (isStale && age < cacheConfig.ttl + cacheConfig.swr) {
        // stale-while-revalidate: 古いキャッシュを返しつつバックグラウンド更新
        ctx.waitUntil(revalidateCache(cache, cacheKey, request, cacheConfig));
        response = new Response(response.body, response);
        response.headers.set('X-Cache', 'STALE');
        response.headers.set('X-Cache-Age', String(age));
        return response;
      }
 
      if (!isStale) {
        response = new Response(response.body, response);
        response.headers.set('X-Cache', 'HIT');
        response.headers.set('X-Cache-Age', String(age));
        return response;
      }
      // TTL + SWR を超過 → フォールスルーして再取得
    }
 
    // --- キャッシュミス: オリジンから取得 ---
    const originResponse = await fetch(request);
 
    if (originResponse.ok) {
      const cachedResponse = new Response(originResponse.body, originResponse);
      cachedResponse.headers.set('Cache-Control', `public, max-age=${cacheConfig.ttl + cacheConfig.swr}`);
      cachedResponse.headers.set('X-Cache-Tags', cacheConfig.tags.join(','));
      cachedResponse.headers.set('X-Cache-Timestamp', String(Date.now()));
 
      // バックグラウンドでキャッシュ保存
      ctx.waitUntil(cache.put(cacheKey, cachedResponse.clone()));
 
      const finalResponse = new Response(cachedResponse.body, cachedResponse);
      finalResponse.headers.set('X-Cache', 'MISS');
      return finalResponse;
    }
 
    // --- オリジンエラー時のフォールバック ---
    if (response) {
      // 古いキャッシュがあれば返す (stale-if-error)
      const fallback = new Response(response.body, response);
      fallback.headers.set('X-Cache', 'STALE-ERROR');
      return fallback;
    }
 
    return originResponse;
  },
};
 
function getCacheConfig(pathname) {
  for (const [pattern, config] of Object.entries(CACHE_CONFIG)) {
    if (pathname.startsWith(pattern)) {
      return config;
    }
  }
  return null;
}
 
function getAge(response) {
  const timestamp = response.headers.get('X-Cache-Timestamp');
  if (!timestamp) return Infinity;
  return Math.floor((Date.now() - parseInt(timestamp)) / 1000);
}
 
async function revalidateCache(cache, cacheKey, request, config) {
  try {
    const freshResponse = await fetch(request);
    if (freshResponse.ok) {
      const cached = new Response(freshResponse.body, freshResponse);
      cached.headers.set('Cache-Control', `public, max-age=${config.ttl + config.swr}`);
      cached.headers.set('X-Cache-Tags', config.tags.join(','));
      cached.headers.set('X-Cache-Timestamp', String(Date.now()));
      await cache.put(cacheKey, cached);
    }
  } catch (e) {
    console.error('Revalidation failed:', e);
  }
}
 
async function handleMutation(request, env) {
  const response = await fetch(request);
  // 書き込み操作後にキャッシュをパージ
  if (response.ok) {
    const cache = caches.default;
    // 関連するキャッシュエントリを削除
    // 本番環境ではKVやDurable Objectsでキャッシュキーを管理
  }
  return response;
}

# wrangler.toml
# Cloudflare Workers の設定ファイル
 
name = "edge-api-cache"
main = "workers/edge-api-cache.js"
compatibility_date = "2024-09-01"
 
# --- 環境設定 ---
[env.production]
routes = [
  { pattern = "api.example.com/api/*", zone_name = "example.com" }
]
 
[env.staging]
routes = [
  { pattern = "api-staging.example.com/api/*", zone_name = "example.com" }
]
 
# --- KV Namespace（キャッシュメタデータ用） ---
binding = "CACHE_META"
id = "abc123def456"
preview_id = "789ghi012jkl"
 
# --- 環境変数 ---
[vars]
ENVIRONMENT = "production"
ORIGIN_URL = "https://origin.example.com"
 
# --- シークレット（wrangler secret putで設定） ---
# ORIGIN_AUTH_TOKEN
# PURGE_API_KEY

// lambda/image-optimizer.js
// Lambda@Edge: Origin Response トリガーで画像フォーマットを最適化
 
const AWS = require('aws-sdk');
const sharp = require('sharp');
const S3 = new AWS.S3({ region: 'ap-northeast-1' });
 
const SUPPORTED_FORMATS = ['webp', 'avif', 'jpeg', 'png'];
const MAX_WIDTH = 2048;
const MAX_HEIGHT = 2048;
const QUALITY_MAP = {
  webp: 80,
  avif: 65,
  jpeg: 85,
  png: 90,
};
 
exports.handler = async (event) => {
  const response = event.Records[0].cf.response;
  const request = event.Records[0].cf.request;
 
  // 画像リクエスト以外はそのまま返す
  if (!isImageRequest(request.uri)) {
    return response;
  }
 
  // オリジンが200以外ならそのまま返す
  if (response.status !== '200') {
    return response;
  }
 
  try {
    // クエリパラメータからリサイズ指定を取得
    const params = parseQueryString(request.querystring);
    const width = Math.min(parseInt(params.w) || 0, MAX_WIDTH) || undefined;
    const height = Math.min(parseInt(params.h) || 0, MAX_HEIGHT) || undefined;
 
    // Accept ヘッダーから最適なフォーマットを決定
    const acceptHeader = request.headers['accept']
      ? request.headers['accept'][0].value
      : '';
    const targetFormat = determineFormat(acceptHeader, request.uri);
 
    // S3から元画像を取得
    const s3Key = decodeURIComponent(request.uri.substring(1));
    const s3Object = await S3.getObject({
      Bucket: process.env.S3_BUCKET || 'my-images-bucket',
      Key: s3Key,
    }).promise();
 
    // sharp で変換
    let pipeline = sharp(s3Object.Body);
 
    // リサイズ（指定がある場合）
    if (width || height) {
      pipeline = pipeline.resize(width, height, {
        fit: 'inside',
        withoutEnlargement: true,
      });
    }
 
    // フォーマット変換
    const quality = QUALITY_MAP[targetFormat] || 80;
    pipeline = pipeline.toFormat(targetFormat, { quality });
 
    const optimizedBuffer = await pipeline.toBuffer();
 
    // 変換後のレスポンスを構築
    const optimizedResponse = {
      status: '200',
      statusDescription: 'OK',
      headers: {
        'content-type': [
          { key: 'Content-Type', value: `image/${targetFormat}` },
        ],
        'cache-control': [
          { key: 'Cache-Control', value: 'public, max-age=31536000, immutable' },
        ],
        'x-image-optimized': [
          { key: 'X-Image-Optimized', value: `format=${targetFormat}, size=${optimizedBuffer.length}` },
        ],
        'vary': [
          { key: 'Vary', value: 'Accept' },
        ],
      },
      body: optimizedBuffer.toString('base64'),
      bodyEncoding: 'base64',
    };
 
    return optimizedResponse;
  } catch (error) {
    console.error('Image optimization failed:', error);
    // エラー時は元のレスポンスをそのまま返す
    return response;
  }
};
 
function isImageRequest(uri) {
  return /\.(jpe?g|png|gif|webp|avif|svg)$/i.test(uri);
}
 
function parseQueryString(qs) {
  if (!qs) return {};
  return qs.split('&').reduce((acc, pair) => {
    const [key, value] = pair.split('=');
    acc[decodeURIComponent(key)] = decodeURIComponent(value || '');
    return acc;
  }, {});
}
 
function determineFormat(acceptHeader, uri) {
  // AVIF 対応ブラウザ
  if (acceptHeader.includes('image/avif')) return 'avif';
  // WebP 対応ブラウザ
  if (acceptHeader.includes('image/webp')) return 'webp';
  // 元のフォーマットを維持
  const ext = uri.split('.').pop().toLowerCase();
  if (ext === 'jpg') return 'jpeg';
  return ext;
}

# CloudFront の場合
aws cloudfront create-invalidation \
  --distribution-id E1234567890ABC \
  --paths "/index.html" "/api/data.json" "/sw.js"
 
# Cloudflare の場合
curl -X POST "https://api.cloudflare.com/client/v4/zones/ZONE_ID/purge_cache" \
  -H "Authorization: Bearer TOKEN" \
  -H "Content-Type: application/json" \
  --data '{"files":["https://example.com/index.html"]}'
 
適用対象: HTML ファイル、API レスポンス、Service Worker
コスト: CloudFront は月 1,000 パス無料、以降 $0.005/パス

# Fastly の場合（Surrogate-Key ヘッダーを使用）
# オリジンのレスポンスに以下を付与:
Surrogate-Key: product-123 category-shoes homepage
 
# パージ時:
curl -X PURGE "https://api.fastly.com/service/SERVICE_ID/purge/product-123" \
  -H "Fastly-Key: TOKEN"
 
適用対象: 特定商品の全ページ、特定カテゴリの全ページ
利点: 関連するすべてのページを一括で即時パージ可能

# CloudFront
aws cloudfront create-invalidation \
  --distribution-id E1234567890ABC \
  --paths "/*"
 
# Cloudflare
curl -X POST "https://api.cloudflare.com/client/v4/zones/ZONE_ID/purge_cache" \
  -H "Authorization: Bearer TOKEN" \
  -H "Content-Type: application/json" \
  --data '{"purge_everything":true}'
 
注意: CDN ヒット率が 0% になり、オリジンに大量リクエストが集中
使用場面: 緊急のセキュリティパッチ、重大なバグ修正のみ

# API レスポンスを 30 秒キャッシュ
Cache-Control: public, s-maxage=30, max-age=0
 
# 適用例:
# - 商品一覧 API（在庫数は若干の遅延許容）
# - ニュースフィード（数十秒の遅延は問題なし）
# - ダッシュボード統計（リアルタイムでなくても可）
 
利点: API への負荷を大幅削減（30 秒間は 1 リクエストのみ）
欠点: 最大 30 秒の古いデータが配信される可能性

// Cloudflare Workers の例: パーソナライズされたコンテンツを Edge で生成
export default {
  async fetch(request, env) {
    const url = new URL(request.url);
    const userId = request.headers.get('X-User-ID');
 
    // ユーザー情報を KV から取得（エッジストレージ）
    const userData = await env.KV_STORE.get(`user:${userId}`, 'json');
 
    // パーソナライズされたコンテンツを生成
    const response = await fetch(url);
    const html = await response.text();
    const personalizedHtml = html.replace(
      '{{USERNAME}}',
      userData.name || 'Guest'
    );
 
    return new Response(personalizedHtml, {
      headers: { 'Content-Type': 'text/html; charset=utf-8' }
    });
  }
};
 
適用例:
- ユーザー名の表示
- 地域別コンテンツの出し分け
- A/B テストのバリアント振り分け
- 認証ステータスに応じた UI 変更

# 言語ごとにキャッシュを分離
Vary: Accept-Language
Cache-Control: public, max-age=3600
 
# クライアント:
Accept-Language: ja → /api/products?lang=ja のキャッシュ
Accept-Language: en → /api/products?lang=en のキャッシュ
 
注意: Vary: Cookie は事実上キャッシュ無効化と同義（ユーザーごとに Cookie が異なる）

# 5 分間キャッシュ、期限切れ後も古いキャッシュを返しつつバックグラウンド更新
Cache-Control: public, max-age=300, stale-while-revalidate=60
 
フロー:
1. リクエスト時点でキャッシュが有効（300 秒以内）→ キャッシュから即座に応答
2. キャッシュが期限切れ（300-360 秒）→ 古いキャッシュを返しつつオリジンに再取得リクエスト
3. 360 秒超過 → オリジンから取得（通常のキャッシュミス）
 
適用例: 頻繁に更新されるが、数秒の遅延は許容できるコンテンツ