0
322
VistasAWS API gateway and authorizer CORS error
It took me awhile to realized it's not a CORS issue. I have Cognito authorizer setup with my API Gateway. I test with the my IDtoken using Postman, when the authorizer on my header is incorrect or the token is expired, postman response would tell me
{
"message": "Unauthorized"
}
{
"message": "Token expired"
}
The problem is, in my dev/localhost; I would get the results correctly if the token is correct, but when the token is bad or expired, I get a CORs error. How do I set this up so I can handle the results correctly?
Access to XMLHttpRequest at 'https://xcz3vfg4n7.execute-api.us-west-2.amazonaws.com/prod' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
xhr.js:210 POST https://xcz3vfg4n7.execute-api.us-west-2.amazonaws.com/prod net::ERR_FAILED 403
1 Respuestas
Responde la pregunta0
We ran into this same issue and since it was a painful to resolve, thought I would type up the solution.
Specifically we were receiving the CORs error via Axios in our React app, but not getting the error through cURL or Thunderclient (Postman-like extension for VS Code).
The resolution was actually missing headers on the "response" object from API Gateway.
Since cURL and Thunderclient/Postman don't care about CORs (because they server-based, not browser-based), those tools don't look for the 'Access-Control-Allow-Origin' header in the response.
We got back our preflight Options call 200 just fine, and then realized that the POST call was returning the 401 without an 'Access-Control-Allow-Origin' header.
Since the Authorizer is on the Method Request, it never goes past the Lambda proxy in the API Gateway and thus doesn't return full response headers.
So... the solution was actually really simple.
- Go into "Gateway Responses"
- Choose the "Unauthorized" option
- Add the response headers (see screenshot)
IMPORTANT: Don't forget to "Redeploy" your API or the changes won't take effect
Example:
