Cors policy with cloudfront + Api Gateway (VPC Links)

0

Hi,

I'm encountering a strange issue with my API Gateway and my CloudFront app.

When my frontend tries to call my API Gateway (VPC link behind an internal NLB), I get the following error:

Access to XMLHttpRequest at 'https://<API-Gateway-URL>' from origin 'https://<CloudFront-Domain>' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

Here are more details about my API resource configuration: /API/{proxy+} - ANY - Method execution

I have set up the method response to include Access-Control-Allow-Origin: *. I also configured the OPTIONS method with the same Access-Control-Allow-Origin header.

In my backend code, I included the following CORS headers and even in nginx conf:

add_header 'Access-Control-Allow-Origin' '*' always;
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE' always;
add_header 'Access-Control-Allow-Headers' 'Authorization, Content-Type, Accept, Origin, User-Agent, DNT, Cache-Control, X-Mx-ReqToken, X-Requested-With' always;

Despite these configurations, I'm still experiencing the CORS error. If anyone has any ideas on how to resolve this issue, I would greatly appreciate your assistance.

Thanks in advance!

1 Answer
2

Hello.

How about including "Access-Control-Allow-Origin" in the response in the integration response settings?
https://docs.aws.amazon.com/apigateway/latest/developerguide/api-gateway-integration-settings-integration-response.html

profile picture
EXPERT
answered a month ago
profile picture
EXPERT
reviewed a month ago
profile picture
EXPERT
reviewed a month ago