SSTのStaticSite等でCloud Frontの価格クラスを設定する

前にSSTで静的WebサイトをAWSにデプロイするという内容の記事を書いたね。今回もSST関連記事だよ。

※画像引用：https://sst.dev/

CloudFrontには価格クラスというものがあって、それによって使えるエッジロケーションと料金が変わる。CDNとして使うのだから、主要なユーザーとの距離が地理的に近いエッジロケーションを使いたいよね？ ところがCDKやSSTでサイトをデプロイするときのCloudFrontのデフォルトの価格クラス100には、利用可能なエッジロケーションに日本が含まれていないという難点がある。

だから、日本のエッジロケーションを利用して国内ユーザーへのレスポンスを最速にするには、日本が含まれる価格クラス200か、それ以上のクラスを選ぶ必要があるんだ。

ここで登場するのが、aws-cdk-lib/aws-cloudfrontパッケージのPriceClassクラス。これを使って、CloudFrontの価格クラスを設定することができる。SSTのコードで見せると、こんな感じ。

const site = new StaticSite(stack, "site", {
  // Next.jsの静的Webサイトをデプロイするコードで例示　
  path: "packages/[静的WebサイトとしてデプロイするNext.jsのアプリ名]",
  buildOutput: "out",
  buildCommand: "npm run build",

  // もしカスタムドメインを持っていて静的サイトに割り振りたいなら
  // customDomain: "ドメイン名をここに書く",

  // SSTがラップしているCDKのプロパティを下記でいじる
  cdk: {
    distribution: {
      // CloudFrontの価格クラスを200に設定
      priceClass: PriceClass.PRICE_CLASS_200
    }
  }
});

これで日本国内のエッジロケーションを使えるようになるよ！

関連記事