Firebase Hostingのキャッシュ設定をする

Next.js exportで静的ジェネレートしたサイトをFirebase Hostingでホスティングしている。

その際に、firebase.jsonに追記することで手軽にキャッシュ設定ができた。

↓のようにするとクライアントサイドで24時間画像のキャッシュをするようになる。

{
  "hosting": {
    "public": "out",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "trailingSlash": true,
    "headers": [
      {
        "source": "**/*",
        "headers": [
          {
            "key": "Cache-Control",
            "value": "max-age=60"
          }
        ]
      },
      {
        "source": "**/*.@(jpg|jpeg|gif|png)",
        "headers": [
          {
            "key": "Cache-Control",
            "value": "max-age=82800"
          }
        ]
      },
      {
        "source": "404",
        "headers": [
          {
            "key": "Cache-Control",
            "value": "max-age=300"
          }
        ]
      }
    ]
  }
}