feat(nextjs-cdk-construct): Allow to whitelist headers (#2325)

Author: nalejandroveron

documentation/docs/cdkconstruct.md

@@ -92,6 +92,8 @@ new NextJSLambdaEdge(this, "NextJsApp", {
 - `s3Props?: Partial<BucketProps>` - pass custom s3 props
 - `whiteListedCookies?: string[]` - provide a list of cookies to forward to the
   CloudFront origin.
+- `whiteListedHeaders?: string[]` - provide a list of headers to forward to the
+  CloudFront origin.
 - `defaultBehavior?: Partial<cloudfront.Behaviour>` - provide overrides for the
   default behavior
 - `behaviours?: Array<cloudfront.Behaviour>` - an array of Cloudfront

packages/serverless-components/nextjs-cdk-construct/__tests__/construct.test.ts

@@ -67,6 +67,33 @@ describe("CDK Construct", () => {
     });
   });
 
+  it("lambda cache policy passes correct headers to origin when specified", () => {
+    const stack = new Stack();
+    new NextJSLambdaEdge(stack, "Stack", {
+      serverlessBuildOutDir: path.join(__dirname, "fixtures/app"),
+      whiteListedHeaders: ["my-header"],
+      cachePolicyName: {
+        lambdaCache: "NextLambdaCache"
+      }
+    });
+
+    const synthesizedStack = SynthUtils.toCloudFormation(stack);
+    expect(synthesizedStack).toHaveResourceLike(
+      "AWS::CloudFront::CachePolicy",
+      {
+        CachePolicyConfig: {
+          Name: "NextLambdaCache",
+          ParametersInCacheKeyAndForwardedToOrigin: {
+            HeadersConfig: {
+              HeaderBehavior: "whitelist",
+              Headers: ["my-header"]
+            }
+          }
+        }
+      }
+    );
+  });
+
   it("lambda cache policy passes correct cookies to origin when specified", () => {
     const stack = new Stack();
     new NextJSLambdaEdge(stack, "Stack", {

packages/serverless-components/nextjs-cdk-construct/src/index.ts

@@ -271,7 +271,11 @@ export class NextJSLambdaEdge extends Construct {
       {
         cachePolicyName: props.cachePolicyName?.lambdaCache,
         queryStringBehavior: cloudfront.CacheQueryStringBehavior.all(),
-        headerBehavior: cloudfront.CacheHeaderBehavior.none(),
+        headerBehavior: props.whiteListedHeaders
+          ? cloudfront.CacheHeaderBehavior.allowList(
+              ...props.whiteListedHeaders
+            )
+          : cloudfront.CacheHeaderBehavior.none(),
         cookieBehavior: {
           behavior: props.whiteListedCookies?.length ? "whitelist" : "all",
           cookies: props.whiteListedCookies

packages/serverless-components/nextjs-cdk-construct/src/props.ts

@@ -76,6 +76,13 @@ export interface Props extends StackProps {
    * .e.g ['my-apps-auth-token-cookie-key']
    */
   whiteListedCookies?: string[];
+
+  /**
+   * Provide a list of headers to forward to the CloudFront origin.
+   * This is useful if your SSR page is depending on headers from the request.
+   */
+  whiteListedHeaders?: string[];
+
   /**
    * Provide a subset (or all) of the props to override the CloudFront
    * distributions default props.