Cloudfront distribution returning incorrect CORS headers

4

Hi

I have configured my CloudFront distribution (in front of AppSync) to use a custom response header policy:

  • Access-Control-Allow-Credentials: false
  • Access-Control-Allow-Headers: *
  • Access-Control-Allow-Methods: ALL
  • Access-Control-Allow-Origin: *
  • Access-Control-Expose-Headers: *

When I test by making a JS fetch (POST) request from a vue.js method from localhost however, the preflight OPTIONS response does not contain any of the headers above and so the browser prevents the cors request.

What am I missing?

Thanks

Ben

asked 2 years ago3176 views
6 Answers
2

Hey, I got the same/similar issue as well.

I am using CF -> HTTP API (JWT Authorizer) -> Lambda

In my Lambda I configured the CORS headers to be sent in the response. This all works fine until I try to use either the CloudFront response header or the API Gateway CORS settings. The headers set in the Lambda code are gone as expected as CF and AG would replace it. BUT the CORS headers configured by CF or AG are missing.

So is there still an issue or do I miss something?

answered 2 years ago
1

I was able to reproduce your problem at the time you wrote it. There was a bug in CloudFront which would have caused it not to return any CORS headers at all if your browser sent the Access-Control-Request-Headers header as part of the OPTIONS request, given the custom headers policy you are using. This bug has now been fixed, so your policy should work as expected.

If you are still having problems, I recommend you open a case with AWS support.

As a workaround, you could use CloudFront Functions to add the headers in response to OPTIONS requests, until the bug above is fixed. You can find an example of how to do this here: https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/example-function-add-cors-header-response.html

This could also be done using Lambda@Edge functions, on the Origin Response trigger.

AWS
EXPERT
Paul_L
answered 2 years ago
  • Was this fix rolled out? I'm not having any joy getting CORS to work with cloudfront+appsync Apr 2022, messing with the response policies seems to have no effect. Does it work with the new appsync custom domains?

  • We're having similar issues with CF and our API on EC2. The "override" button for CF CORS policy doesn't behave as expected. When disabled, for example, we get "access-control-allow-credentials: true" from our API. When we enable "Origin override" with Access-Control-Allow-Credentials set to true, the "access-control-allow-credentials" is NOT returned at all. This also happens with the Access-Control-Expose-Headers setting.

1

Hi Ben!

Did you face the response header problem with OTIONS only or other methods also? If possible, could you please share your cache behavior configuration using this managed policies?

Thanks! HaiNT

answered 2 years ago
0

I have also been having an issue with my response policy.

I have set the policy to configure CORS headers but no CORS headers are attached to the response.

I added a custom header and it attaches this header perfectly fine, every response has the custom header.

Surprised this hasn't been solved, its clearly been an issue for several months now.

answered 2 years ago
0

Hi, we still face the same problem on AWS Region EU (Frankfurt).

We use a cloudfront distribution with a response header return policy. The response header return policy is configured with:

  • Access-Control-Allow-Origin: *

Examples:

Does return "Access-Control-Allow-Origin: *"

Does not return "Access-Control-Allow-Origin" Header.

answered a year ago
0

Hello,

The peflight request you are making is missing at least the Access-Control-Request-Method request header.

curl -X OPTIONS -H "Origin: http://example.com" -H "Access-Control-Request-Method: POST" --verbose https://<CLOUDFRONT_URL>

profile pictureAWS
EXPERT
achraf
answered a year ago

You are not logged in. Log in to post an answer.

A good answer clearly answers the question and provides constructive feedback and encourages professional growth in the question asker.

Guidelines for Answering Questions