本文属于机器翻译版本。若本译文内容与英语原文存在差异，则一律以英文原文为准。

# AWS WAF 使用 Amplify 应用程序启用 AWS CDK
<a name="amplify-waf-CDK"></a>

您可以使用 AWS Cloud Development Kit (AWS CDK) 来启用 Ampli AWS WAF fy 应用程序。要了解有关使用 CDK 的更多信息，请参阅《AWS Cloud Development Kit (AWS CDK) 开发人员指南》中的 [What is the CDK?](https://docs.aws.amazon.com/cdk/v2/guide/home.html)**。

以下 TypeScript 代码示例演示如何创建包含两个 CDK 堆栈的 AWS CDK 应用程序：一个用于 Amplify，一个用于。 AWS WAF请注意， AWS WAF 堆栈必须部署到美国东部（弗吉尼亚北部）(us-east-1) 区域。Amplify 应用程序堆栈可以部署到不同的区域。您必须创建要与全球 (CloudFront) 区域中的 Amplify 应用程序关联的网络 ACL。您 ACLs 可能已经存在区域网络 AWS 账户，但它们与 Amplify 不兼容。

```
import * as cdk from "aws-cdk-lib";
import { Construct } from "constructs";
import * as wafv2 from "aws-cdk-lib/aws-wafv2";
import * as amplify from "aws-cdk-lib/aws-amplify";

interface WafStackProps extends cdk.StackProps {
  appArn: string;
}

export class AmplifyStack extends cdk.Stack {
  public readonly appArn: string;
  constructor(scope: Construct, id: string, props?: cdk.StackProps) {
    super(scope, id, props);
    const amplifyApp = new amplify.CfnApp(this, "AmplifyApp", {
      name: "MyApp",
    });
    this.appArn = amplifyApp.attrArn;
  }
}

export class WAFStack extends cdk.Stack {
  constructor(scope: Construct, id: string, props: WafStackProps) {
    super(scope, id, props);
    const webAcl = new wafv2.CfnWebACL(this, "WebACL", {
      defaultAction: { allow: {} },
      scope: "CLOUDFRONT",
      rules: [
        // Add your own rules here.
      ],
      visibilityConfig: {
        cloudWatchMetricsEnabled: true,
        metricName: "my-metric-name",
        sampledRequestsEnabled: true,
      },
    });

    new wafv2.CfnWebACLAssociation(this, "WebACLAssociation", {
      resourceArn: props.appArn,
      webAclArn: webAcl.attrArn,
    });
  }
}

const app = new cdk.App();

// Create AmplifyStack in your desired Region.
const amplifyStack = new AmplifyStack(app, 'AmplifyStack', {
  env: { region: 'us-west-2' },
});

// Create WAFStack in IAD region, passing appArn from AmplifyStack.
new WAFStack(app, 'WAFStack', {
  env: { region: 'us-east-1' }, 
  crossRegionReferences: true,

  appArn: amplifyStack.appArn,  // Pass appArn from AmplifyStack.
});
```