From d88001e328204e873cfcf49a8c3b191330508d89 Mon Sep 17 00:00:00 2001
From: statefb <tmgf.15.su@gmail.com>
Date: Wed, 15 Jan 2025 12:22:30 +0900
Subject: [PATCH] refactor: Cloudfront Distribution

---
 cdk/lib/constructs/frontend.ts | 59 ++++++++++++++--------------------
 1 file changed, 24 insertions(+), 35 deletions(-)

diff --git a/cdk/lib/constructs/frontend.ts b/cdk/lib/constructs/frontend.ts
index 19e5fb8f2..c56cd65f9 100644
--- a/cdk/lib/constructs/frontend.ts
+++ b/cdk/lib/constructs/frontend.ts
@@ -1,5 +1,5 @@
 import { Construct } from "constructs";
-import { CfnOutput, RemovalPolicy, Stack } from "aws-cdk-lib";
+import { CfnOutput, Duration, RemovalPolicy, Stack } from "aws-cdk-lib";
 import {
   BlockPublicAccess,
   Bucket,
@@ -7,9 +7,11 @@ import {
   IBucket,
 } from "aws-cdk-lib/aws-s3";
 import {
-  CloudFrontWebDistribution,
-  OriginAccessIdentity,
+  CachePolicy,
+  Distribution,
+  ViewerProtocolPolicy,
 } from "aws-cdk-lib/aws-cloudfront";
+import { S3BucketOrigin } from "aws-cdk-lib/aws-cloudfront-origins";
 import { NodejsBuild } from "deploy-time-build";
 import { Auth } from "./auth";
 import { Idp } from "../utils/identity-provider";
@@ -23,7 +25,7 @@ export interface FrontendProps {
 }
 
 export class Frontend extends Construct {
-  readonly cloudFrontWebDistribution: CloudFrontWebDistribution;
+  readonly cloudFrontWebDistribution: Distribution;
   readonly assetBucket: Bucket;
   constructor(scope: Construct, id: string, props: FrontendProps) {
     super(scope, id);
@@ -38,46 +40,33 @@ export class Frontend extends Construct {
       serverAccessLogsPrefix: "AssetBucket",
     });
 
-    const originAccessIdentity = new OriginAccessIdentity(
-      this,
-      "OriginAccessIdentity"
-    );
-    const distribution = new CloudFrontWebDistribution(this, "Distribution", {
-      originConfigs: [
-        {
-          s3OriginSource: {
-            s3BucketSource: assetBucket,
-            originAccessIdentity,
-          },
-          behaviors: [
-            {
-              isDefaultBehavior: true,
-            },
-          ],
-        },
-      ],
-      errorConfigurations: [
+    const distribution = new Distribution(this, "Distribution", {
+      defaultRootObject: "index.html",
+      defaultBehavior: {
+        origin: S3BucketOrigin.withOriginAccessControl(assetBucket),
+        viewerProtocolPolicy: ViewerProtocolPolicy.HTTPS_ONLY,
+        cachePolicy: CachePolicy.CACHING_OPTIMIZED,
+      },
+      errorResponses: [
         {
-          errorCode: 404,
-          errorCachingMinTtl: 0,
-          responseCode: 200,
+          httpStatus: 404,
+          ttl: Duration.seconds(0),
+          responseHttpStatus: 200,
           responsePagePath: "/",
         },
         {
-          errorCode: 403,
-          errorCachingMinTtl: 0,
-          responseCode: 200,
+          httpStatus: 403,
+          ttl: Duration.seconds(0),
+          responseHttpStatus: 200,
           responsePagePath: "/",
         },
       ],
       ...(!this.shouldSkipAccessLogging() && {
-        loggingConfig: {
-          bucket: props.accessLogBucket,
-          prefix: "Frontend/",
-        },
+        logBucket: props.accessLogBucket,
+        logFilePrefix: "Frontend/",
       }),
-      webACLId: props.webAclId,
-      enableIpV6: props.enableIpV6,
+      webAclId: props.webAclId,
+      enableIpv6: props.enableIpV6,
     });
 
     NagSuppressions.addResourceSuppressions(distribution, [