1

I have deployed a lambda, which in itself returns an 'Access-Control-Allow-Origin': '*' header in it's response.

I call it from an API Gateway. When calling the API gateway URL, the CORS configuration is fine.

I placed CloudFront in front of the API, however now I am unable to access the API as the CORS configuration seems to be overridden by CloudFront, and I am not sure where to add custom headers in CloudFront.

How do you enable CORS inside CloudFront?

David Alsh
  • 6,747
  • 6
  • 34
  • 60

1 Answers1

8

Go into your CloudFront distribution, click behaviours, select each behaviour and click edit, you'll see the section titled whitelist headers. Select 'Access-Control-Request-Headers' and 'Access-Control-request-methods' and click Add, also add Origin(thanks Michael for the catch), bottom right click "yes, edit".

Edit: please see Michael's comment below regarding preventing cached responses.

Voila.

Mrk Fldig
  • 4,244
  • 5
  • 33
  • 64
  • 1
    Also `Origin`, I would expect. – Michael - sqlbot Jul 22 '18 at 20:46
  • 1
    This should be the correct solution. You'll also probably want to change the [Error Caching Minimum TTL to 0](https://stackoverflow.com/a/35541525/1695906) so that you aren't trying to troubleshoot against cached error responses. – Michael - sqlbot Jul 22 '18 at 22:57