NextJSSite: Error Responses Not Generating In Cloudfront

[ZacharySpilinek]

For a NextjsSite, the SST docs state that you can add error response pages: https://docs.sst.dev/constructs/NextjsSite#cdkdistribution. However, it doesn't work.

  const site = new NextjsSite(stack, 'MySite', {
    customDomain: setCustomDomain(stack),
    cdk: {
      distribution: {
        defaultBehavior: {
          viewerProtocolPolicy: ViewerProtocolPolicy.REDIRECT_TO_HTTPS,
          allowedMethods: AllowedMethods.ALLOW_ALL,
        },
        errorResponses: [
          {
            httpStatus: 400,
            responseHttpStatus: 200,
            responsePagePath: '/index.html',
            ttl: Duration.minutes(10),
          }
        ],
        httpVersion: HttpVersion.HTTP2_AND_3,
      },
    },
  });

After much digging, we discovered that the errorResponses array is being ignored. PR #3735 addresses that change and allows it to work again.

If that change isn't approved, then the documentation and TS types need to updated.

The workaround for now is this:

  const site = new NextjsSite(stack, 'MySite', {
    customDomain: setCustomDomain(stack),
    cdk: {
      transform: (plan) => {
        plan.errorResponses = [
          {
            httpStatus: 400,
            responseHttpStatus: 200,
            responsePagePath: '/index.html',
            ttl: Duration.minutes(10),
          },
        ];
      },
      distribution: {
        defaultBehavior: {
          viewerProtocolPolicy: ViewerProtocolPolicy.REDIRECT_TO_HTTPS,
          allowedMethods: AllowedMethods.ALLOW_ALL,
        },
        httpVersion: HttpVersion.HTTP2_AND_3,
      },
    },
  });