0

So my AWS HTTP API GATEWAY is integrated to a Lambda Function.

Here's my CORS configuration On AWS. CORS Config

My GET & POST(without body) requests are working fine. enter image description here

But when I make a POST request with some data/body, it has a CORS error.

Access to XMLHttpRequest at 'https://api_url/test' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

I understand how the browser sends an OPTIONS request before the Original POST request to the server.

Here's the CORS error with the OPTIONS request. enter image description here

Here's how i call my request from a react app using axios.

const res_post = axios.post(`${process.env.REACT_APP_AWS_API_GATEWAY}/test`, {key: "value"}).then((res) => {
    console.log("AXIOS POST REQUEST 2 RESULT", res, res.data);
});

I tried adding hearders to the axios call, No Luck. I added a route(for / & /test) for a OPTIONS request, as suggested by some answers, unfortunately No luck. enter image description here

I have spent over 4 hours figuring out and applying all the solutions on stackoverflow. I will appreciate if someone can point me the right direction. I have read multiple stackoverflow questions and applied several of them.

sideshowbarker
  • 81,827
  • 26
  • 193
  • 197
Aryan Arora
  • 143
  • 2
  • 12

1 Answers1

1

Refer to this: Vue & Axios + AWS API Gateway & Lambda - CORS + POST not working

Even though I added a way to handle OPTIONS requests. My lambda function was returning and empty response. I fixed that and it worked.

Aryan Arora
  • 143
  • 2
  • 12