推陈出新：使用CDK快速部署并持续发布CloudFront CDN服务

wget https://gdm-share.s3.cn-north-1.amazonaws.com.cn/cloudfrontcdk.zip
unzip cloudfrontcdk.zip
tree -a CloudfrontCdkDemo

CloudfrontCdkDemo
├── bin (CDK 应用入口程序)
│   └── cloufront_cdk_demo.ts
├── cdk.json (告诉 CDK toolkit 如何去运行 CDK 应用的配置文件)
├── flask-demo (Flask Web 应用程序文件)
│   ├── app
│   │   ├── app.py
│   │   ├── requirements.txt
│   │   ├── start.sh
│   │   └── templates
│   │       └── index.html
│   └── static
│       ├── AWS_logo_RGB.png
│       └── css
│           └── mystyle.css
├── functions (Lambda@Edge 代码和CloudFront Function 代码)
│   ├── cffunc
│   │   └── cffunc.js
│   └── lambda
│       └── index.js
├── .gitignore (告诉 Git 哪些文件不需要&需要添加到版本管理中的配置文件)
├── lib (CDK 应用所包含的应用资源模版和CloudFront资源模版)
│   ├── cloudfront_cdk-stack.ts
│   └── infra_cdk-stack.ts
├── .npmignore (告诉 npm 哪些文件不需要&需要添加到npm publish打包中的配置文件)
├── package.json (npm模块配置列表)
├── README.md
└── tsconfig.json (TypeScript 配置信息)

……

const app = new cdk.App();
new InfraCdkStack(app, 'InfraCdkStack', {
  env: { account: process.env.CDK_DEFAULT_ACCOUNT, region: process.env.CDK_DEFAULT_REGION }
});

new CloudfrontCdkStack(app, 'CloudfrontCdkStack', {
  env: { account: process.env.CDK_DEFAULT_ACCOUNT, region: process.env.CDK_DEFAULT_REGION }
});

……

/* Create a S3 bucket to hold flask static content */
    const staticBucket = new s3.Bucket(this, 'AssetsBucket', {
      removalPolicy: cdk.RemovalPolicy.DESTROY
    });
  
    new s3deploy.BucketDeployment(this, 'StaticAssets', {
      sources: [s3deploy.Source.asset('./flask-demo/static')],
      destinationBucket: staticBucket,
      destinationKeyPrefix: 'static'
    }); // Upload static content to S3 bucket for Flask website
    
    const appAssets = new assets.Asset(this, 'AppAssets', {
      path: './flask-demo/app'
}); // Upload Flask app files as a zip file to assets bucket for EC2 to download and run

……

……

/* Create an EC2 to run flask app which generates the dynamic content */ 
    const vpc = ec2.Vpc.fromLookup(this, 'VPC', {isDefault: true,});
    
    const amznLinux = ec2.MachineImage.latestAmazonLinux({
      generation: ec2.AmazonLinuxGeneration.AMAZON_LINUX_2
    });
    
    const appInstance = new ec2.Instance(this, 'Instance',{
      vpc: vpc,
      instanceType: ec2.InstanceType.of(ec2.InstanceClass.T3, ec2.InstanceSize.MICRO),
      machineImage: amznLinux,
      keyName:'demo' // You need to modify the value of keyName with your own key-pairs name!
    });
    
    appAssets.grantRead(appInstance.role);
    appInstance.userData.addS3DownloadCommand({
      bucket: appAssets.bucket,
      bucketKey: appAssets.s3ObjectKey,
      localFile: '/tmp/app.zip'
    });
    appInstance.userData.addCommands('cd /tmp && unzip -o app.zip && chmod +x start.sh && ./start.sh && rm /var/lib/cloud/instance/sem/config_scripts_user');
    
    appInstance.connections.allowFromAnyIpv4(ec2.Port.tcp(22), 'Allow ssh from internet');
appInstance.connections.allowFromAnyIpv4(ec2.Port.tcp(80), 'Allow http from internet');

……

……

/* Store S3 bucket arn and EC2 public domain name in the SSM Parameter Store */ 
    new ssm.StringParameter(this, 'BuckerName', {
      description: 'S3 Bucket Name',
      parameterName: 's3BucketName',
      stringValue: staticBucket.bucketName
    });
    new ssm.StringParameter(this, 'EC2PublicDomainName', {
      description: 'EC2 Public Domain Name',
      parameterName: 'ec2PublicDnsName',
      stringValue: appInstance.instancePublicDnsName
});

……

……
/* Import the existing S3 bucket as CloudFront's S3 origin*/
    const s3BucketName = ssm.StringParameter.fromStringParameterName(this, 'BuckerName', 's3BucketName').stringValue;

    const s3Origin = s3.Bucket.fromBucketName(this, 'ImportBucket', s3BucketName);
    
    const oai = new cloudfront.OriginAccessIdentity(this, 'OAI'); // Create an OAI for CloudFront to use
    
    const policyStatement = new iam.PolicyStatement({
      actions:    [ 's3:GetObject' ],
      resources:  [ s3Origin.arnForObjects("*") ],
      principals: [ oai.grantPrincipal ],
    }); // S3 bucket policy for granting OAI to access S3 objects 
    
    new s3.BucketPolicy(this, 'cloudfrontAccessBucketPolicy', {
      bucket: s3Origin,
    }).document.addStatements(policyStatement); // Add OAI granted bucket policy to S3 (It will override the existing bucket policy if had) 
    
    const httpOrigin = ssm.StringParameter.fromStringParameterName(this, 'EC2PublicDomainName', 'ec2PublicDnsName').stringValue; // Import EC2 public Domain Name as CloudFront's Http Origin
    
……

……

/* Example 1: Create a stand CF distribution with 2 behaviors which use above EC2 and S3 as origins */
    const distribution = new cloudfront.Distribution(this, 'myDist', {
      defaultBehavior: {
        origin: new origins.HttpOrigin(httpOrigin,{
          protocolPolicy:cloudfront.OriginProtocolPolicy.HTTP_ONLY
        }),
        viewerProtocolPolicy: cloudfront.ViewerProtocolPolicy.REDIRECT_TO_HTTPS,
        cachePolicy: cloudfront.CachePolicy.CACHING_DISABLED
      },
      additionalBehaviors: {
        '/static/*': {
          origin: new origins.S3Origin(s3Origin, {originAccessIdentity: oai}),
          viewerProtocolPolicy: cloudfront.ViewerProtocolPolicy.REDIRECT_TO_HTTPS,
          cachePolicy: cloudfront.CachePolicy.CACHING_OPTIMIZED
        }
      }
});

……

……

/* Example 2: Basing on Example 1, create a L@E function and a CF distribution, then associate the L@E function to a specific behavior of CF distribution */
    const customCachePolicy = new cloudfront.CachePolicy(this, 'customCachePolicy', {
      cachePolicyName: 'customCachePolicy-Lambda',
      comment: 'Lambda will modify the TTL via "cache-control" header',
      defaultTtl: cdk.Duration.seconds(0), 
      minTtl: cdk.Duration.seconds(0),
      maxTtl:cdk.Duration.seconds(3600),
      enableAcceptEncodingBrotli: true,
      enableAcceptEncodingGzip: true,
      headerBehavior: cloudfront.CacheHeaderBehavior.allowList('CloudFront-Viewer-Country')
    }); // Create a custom cache policy reserved for L@E
    
    const customOriginRequestPolicy = new cloudfront.OriginRequestPolicy(this, 'customOriginRequestPolicy', {
      originRequestPolicyName: 'customOriginRequestPolicy-Lambda',
      comment: 'Pass the "CloudFront-Viewer-Country" header to origin',
      headerBehavior: cloudfront.OriginRequestHeaderBehavior.allowList('CloudFront-Viewer-Country')
}); // Create a custom origin request policy reserved for L@E

const lambdaFunc = new EdgeFunction(this, 'LambdaFunction', {
      runtime: lambda.Runtime.NODEJS_14_X,
      handler: 'index.handler',
      code: lambda.Code.fromAsset('./functions/lambda'),
      stackId: 'LambdaEdgeStack'
    });
    
    const dist = distribution.node.defaultChild as cloudfront.CfnDistribution;
    dist.addPropertyOverride('DistributionConfig.DefaultCacheBehavior.CachePolicyId', customCachePolicy.cachePolicyId);
    dist.addPropertyOverride('DistributionConfig.DefaultCacheBehavior.OriginRequestPolicyId', customOriginRequestPolicy.originRequestPolicyId);
    dist.addPropertyOverride('DistributionConfig.DefaultCacheBehavior.LambdaFunctionAssociations', [
      {
        EventType: cloudfront.LambdaEdgeEventType.ORIGIN_REQUEST,
        LambdaFunctionARN: lambdaFunc.currentVersion.edgeArn
      }
    ]);

……

……

/* Example 3: Basing on Example 2, create a CF function and associate it to a specific behavior of CF distribution */
    const cfFunc = new cloudfront.Function(this, 'CFFunction', {
      code: cloudfront.FunctionCode.fromFile({filePath: './functions/cffunc/cffunc.js'})
    })
    
    dist.addPropertyOverride('DistributionConfig.DefaultCacheBehavior.FunctionAssociations', [
      {
        EventType: cloudfront.FunctionEventType.VIEWER_REQUEST,
        FunctionARN: cfFunc.functionArn
      }
]);

……

const appInstance = new ec2.Instance(this, 'Instance',{
      vpc: vpc,
      instanceType: ec2.InstanceType.of(ec2.InstanceClass.T3, ec2.InstanceSize.MICRO),
      machineImage: amznLinux,
      keyName:'demo' // You need to modify the value of keyName with your own key-pairs name!
    });

cd CloudfrontCdkDemo   # 切换至解压后的示例代码根目录
npm install -g aws-cdk   # 安装 AWS CDK Toolkit，如在 CDK 运行环境准备阶段已经安装过则无需再次安装
npm install  # 按照示例代码中的 ”package.json” 文件列表，安装 CDK 程序运行所需的各种依赖包
npm run build  # Build CDK 应用，将 TypeScript CDK 代码编译为 Node.js 可以直接运行的 JavaScript 代码（可选步骤，CDK 部署应用时会自动执行该命令）
cdk bootstrap  # CDK 部署引导程序，生成CDK部署过程用于存储 Assets 的 S3 存储桶

cdk deploy InfraCdkStack

cdk deploy CloudfrontCdkStack

cdk destroy CloudfrontCdkStack

{
    ……
    "context": {
      ……
      "@aws-cdk/core:newStyleStackSynthesis": true
    }
}

npm install @aws-cdk/aws-codecommit @aws-cdk/pipelines

cat << EOF > ./lib/pipeline-stack.ts
import * as cdk from '@aws-cdk/core';
import * as codecommit from '@aws-cdk/aws-codecommit';

export class PipelineStack extends cdk.Stack {
  constructor(scope: cdk.Construct, id: string, props?: cdk.StackProps) {
    super(scope, id, props);
    
    const repo = new codecommit.Repository(this, 'CloudFrontCDKRepo', {
      repositoryName: "CloudFrontCDKRepo"
    });

  }
}
EOF

……

import { PipelineStack } from '../lib/pipeline-stack';

……

……

new PipelineStack(app, 'PipelineStack', {
  env: { account: process.env.CDK_DEFAULT_ACCOUNT, region: process.env.CDK_DEFAULT_REGION }
});

cdk deploy PipelineStack

git init
git remote add origin https://git-codecommit.<Region>.amazonaws.com/v1/repos/CloudFrontCDKRepo # 请将 <Region> 替换为您当前 CodeCommit Repo 所在 Region
git add -A
git commit -m "initial commit"
git push --set-upstream origin master

……

import { CodePipeline, CodePipelineSource, ShellStep } from '@aws-cdk/pipelines';

……

……

const pipeline = new CodePipeline(this, 'Pipeline', {
  pipelineName: 'CloudfrontPipeline',
  synth: new ShellStep('Synth', {
    input: CodePipelineSource.codeCommit(repo, 'master'),
    commands: ['export NPM_CONFIG_UNSAFE_PERM=true', 'npm ci', 'npm run build', 'npx cdk synth ']
  })
});

……

git add -A
git commit -m "add pipeline"
git push
cdk deploy PipelineStack

cat << EOF > ./lib/pipeline-stage.ts
import * as cdk from '@aws-cdk/core';
import { CloudfrontCdkStack } from './cloudfront_cdk-stack';

export interface PipelineStageProps extends cdk.StageProps {
  stage: string
}; //Define a parameter(prop) to pass to CloudfrontCdkStack

export class PipelineStage extends cdk.Stage {
    public readonly serviceUrl: cdk.CfnOutput;
    
    constructor(scope: cdk.Construct, id: string, props: PipelineStageProps) {
      super(scope, id, props);
  
      const CFStack = new CloudfrontCdkStack(this, 'CFStack',{
        environment: props.stage
      });
      
      this.serviceUrl = CFStack.cfUrl;
    }
}
EOF

……

export interface CloufrontCdkStackProps extends cdk.StackProps {
  environment?: string
}; //Define a parameter(prop) of CloufrontCdkStack for customCachePolicy and customOriginRequestPolicy

export class CloudfrontCdkStack extends cdk.Stack {
  public readonly cfUrl: cdk.CfnOutput;

constructor(scope: cdk.Construct, id: string, props: CloufrontCdkStackProps) {
    super(scope, id, props);

……

……

cachePolicyName: 'customCachePolicy-Lambda',
……

originRequestPolicyName: 'customOriginRequestPolicy-Lambda',

……

……

cachePolicyName: 'customCachePolicy-Lambda-' + props.environment,
……

originRequestPolicyName: 'customOriginRequestPolicy-Lambda-' + props.environment,

……

……

new cdk.CfnOutput(this, 'CFDistributionDNSName', {
      value: distribution.domainName,
      description: 'The CloudFront distribution for flask app'
});

……

……

this.cfUrl = new cdk.CfnOutput(this, 'CFDistributionDNSName', {
      value: distribution.domainName,
      description: 'The CloudFront distribution for flask app'
});

……

import { CodePipeline, CodePipelineSource, ShellStep } from '@aws-cdk/pipelines';

import { CodePipeline, CodePipelineSource, ShellStep, ManualApprovalStep } from '@aws-cdk/pipelines';

import { PipelineStage } from './pipeline-stage';

const staging = new PipelineStage(this, 'Staging', {
  env: { account: process.env.CDK_DEFAULT_ACCOUNT, region: 'us-east-1' },
  stage: 'Staging' // Parameter to pass to PipelineStage then for CloudfrontCdkStack to define policies
});
const deployStaging = pipeline.addStage(staging);

deployStaging.addPost(new ShellStep('Validate',{
  envFromCfnOutputs: {appUrl:staging.serviceUrl},
  commands: ['curl -Ssf https://$appUrl']
}))

const prod = new PipelineStage(this, 'Prod', {
  env: { account: process.env.CDK_DEFAULT_ACCOUNT, region: 'us-east-1' },
  stage: 'Prod' // Parameter to pass to PipelineStage then for CloudfrontCdkStack to define policies
});
const deployProd = pipeline.addStage(prod);

deployProd.addPre(new ManualApprovalStep('ReviewApproval'));

git add -A

git commit -m "add deployment stage"

git push