feat: add CloudFront distribution for app

cdk/BifravstStack.ts

@@ -1,9 +1,8 @@
 import * as CloudFormation from '@aws-cdk/core'
-import { RemovalPolicy } from '@aws-cdk/core'
 import * as Cognito from '@aws-cdk/aws-cognito'
+import * as CloudFront from '@aws-cdk/aws-cloudfront'
 import * as IAM from '@aws-cdk/aws-iam'
 import * as S3 from '@aws-cdk/aws-s3'
-import { HttpMethods } from '@aws-cdk/aws-s3'
 
 export class BifravstStack extends CloudFormation.Stack {
  public constructor(
@@ -100,13 +99,13 @@ export class BifravstStack extends CloudFormation.Stack {
  cors: [
  {
  allowedHeaders: ['*'],
- allowedMethods: [HttpMethods.GET],
+ allowedMethods: [S3.HttpMethods.GET],
  allowedOrigins: ['*'],
  exposedHeaders: ['Date'],
  maxAge: 3600,
  },
  ],
- removalPolicy: RemovalPolicy.DESTROY,
+ removalPolicy: CloudFormation.RemovalPolicy.DESTROY,
  websiteIndexDocument: 'index.html',
  websiteErrorDocument: 'error.html',
  })
@@ -116,8 +115,54 @@ export class BifravstStack extends CloudFormation.Stack {
  exportName: `${this.stackName}:websiteBucketName`,
  })
 
+ const distribution = new CloudFront.CfnDistribution(
+ this,
+ 'websiteDistribution',
+ {
+ distributionConfig: {
+ enabled: true,
+ priceClass: 'PriceClass_100',
+ defaultRootObject: 'index.html',
+ defaultCacheBehavior: {
+ allowedMethods: ['HEAD', 'GET', 'OPTIONS'],
+ cachedMethods: ['HEAD', 'GET'],
+ compress: true,
+ forwardedValues: {
+ queryString: true,
+ headers: [
+ 'Access-Control-Request-Headers',
+ 'Access-Control-Request-Method',
+ 'Origin',
+ ],
+ },
+ smoothStreaming: false,
+ targetOriginId: 'S3',
+ viewerProtocolPolicy: 'redirect-to-https',
+ },
+ ipv6Enabled: true,
+ viewerCertificate: {
+ cloudFrontDefaultCertificate: true,
+ },
+ origins: [
+ {
+ domainName: `${websiteBucket.bucketName}.s3-website.${this.region}.amazonaws.com`,
+ id: 'S3',
+ customOriginConfig: {
+ originProtocolPolicy: 'http-only',
+ },
+ },
+ ],
+ },
+ },
+ )
+
+ new CloudFormation.CfnOutput(this, 'cloudfrontDistributionId', {
+ value: distribution.ref,
+ exportName: `${this.stackName}:cloudFrontDistributionId`,
+ })
+
  new CloudFormation.CfnOutput(this, 'websiteDomainName', {
- value: `${websiteBucket.bucketName}.s3.${this.region}.amazonaws.com`,
+ value: distribution.attrDomainName,
  exportName: `${this.stackName}:websiteDomainName`,
  })
  }

continuous-deployment-app.yml

@@ -14,3 +14,4 @@ phases:
  - export $(cat $CODEBUILD_SRC_DIR_BifravstApp/.env.production.local | xargs)
  - cd $CODEBUILD_SRC_DIR_BifravstApp/; npm ci --no-audit; npm run build;
  - aws s3 cp $CODEBUILD_SRC_DIR_BifravstApp/build s3://$REACT_APP_WEBSITE_BUCKET_NAME --recursive --metadata-directive REPLACE --cache-control 'public,max-age=600' --expires ''
+ - aws cloudfront create-invalidation --distribution-id $REACT_APP_CLOUDFRONT_DISTRIBUTION_ID --paths /,/index.html

package.json

@@ -27,6 +27,7 @@
  "aws-sdk": "^2.493.0"
  },
  "devDependencies": {
+ "@aws-cdk/aws-cloudfront": "^1.0.0",
  "@aws-cdk/aws-codebuild": "^1.0.0",
  "@aws-cdk/aws-codepipeline": "^1.0.0",
  "@aws-cdk/aws-cognito": "^1.0.0",