CORS POST fail with AWS HTTP API Gateway + Lambda integration

Question

I have scoured over 25 SO posts about this but cannot find a solution to my problem. I have an API Gateway with an HTTP API + route that utilizes a Lambda function integration. From SO posts and AWS documentation, I am reading conflicting information:

1. From the AWS documentation, I see

If you configure CORS for an API, API Gateway automatically sends a response to preflight OPTIONS requests, even if there isn't an OPTIONS route configured for your API. For a CORS request, API Gateway adds the configured CORS headers to the response from an integration.

If you configure CORS for an API, API Gateway ignores CORS headers returned from your backend integration.

This is exactly what I did; I configured my CORS as follows: photo

However, I still get the errors:

Access to fetch at 'https://domain.execute-api.aws-region.amazonaws.com/dev/upload' from
 origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight 
request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is 
present on the requested resource. If an opaque response serves your needs, set the 
request's mode to 'no-cors' to fetch the resource with CORS disabled.

From Cloudwatch, I can see the requests being sent to the API, but for some reason the header isn't properly configured. I do not understand this because I thought API Gateway should handle OPTIONS pre-flight requests for HTTP APIs. I cannot find out what I'm doing wrong.

Answer 1

I had a similar issue, the preflight response had no CORS headers. I noticed that the preflight request included the header: Access-Control-Request-Headers: Content-Type

As soon I added Content-Type to the list of Access-Control-Allow-Headers in the HTTP API configuration it worked for me.