Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

amplify 403 comes up that too with a CORS error

Through Amplify CLI added an API that invokes a lambda that reads the dynamo table.

It worked well y'day after the deployment in AWS. Today morning it throws 403 error with no changes being made:

GET https://xxnxxtfxx.execute-api.eu-west-1.amazonaws.com/Prod/items 403

Access to XMLHttpRequest at 'https://xxnxxtfxx.execute-api.eu-west-1.amazonaws.com/Prod/items' from origin ''http://myproject-20181130113531--hostingbucket.s3-website-eu-west-1.amazonaws.com'' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Observations/Actions

  • Ensure CORS is enabled on API Gateway, redeploy the API.

  • Testing API is successful from API Gateway, it invokes the Lambda function properly

  • Amplify service does create the user object and is persisting in localstorage
  • invocation of OPTIONS is looking good as well under developer tools:

    General Settings:

  • Request URL: https://xxnxxtfxx.execute-api.eu-west-1.amazonaws.com/Prod/items

  • Request Method: OPTIONS
  • Status Code: 200

    Response Headers:

  • access-control-allow-headers: Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token
  • access-control-allow-methods: DELETE,GET,HEAD,OPTIONS,PATCH,POST,PUT
  • access-control-allow-origin: *`

Wondering why would 403 come up that to with a CORS error. Any thoughts? what baffles and scares me is that a few hours after I wake up with no changes things are failing :-(

like image 541
stayingcool Avatar asked Dec 02 '18 08:12

stayingcool


People also ask

Why am I getting 403 when accessing an app through amplify?

Getting 403 when accessing an app deployed through amplify console. [1] Having added hosting service to the app, and pushing the changes from terminal using amplify push and amplify publish commands the app works without issues.

Why am I getting a CORS error when using lambda?

CORS errors are all client-side in the browser, so Lambda role permissions shouldn't have anything to do with this (hopefully). OP, try running this with your browser tools open and see what requests your browser's making. I'd recommend Firefox Dev Edition since it gives you the most verbose output.

Why does my API fail to show Cors error?

You might’ve added an image URL only to end up with something like this. Or, your API fails and shows a CORS error in the console. This happens because the same-origin policy is part of the browser’s security model which allows websites to request data from APIs of the same URL but blocks those of different URLs.

Does the 403 Forbidden response really work?

Looks good. Well, minor detail: it doesn’t work. Every request results in a 403 Forbidden response. Yikes! So, going on here? During the refactoring, we removed the Content-Type entry from the HTTP header because we don’t send any payload anyway.


1 Answers

I had the same error (and follow the same actions). In my case, I wasn't passing the correct arguments in the Amplify post call by skipping the init argument. I fix this by passing a myInit argument with an empty body:

let myInit = {
    body: {}
}

API.post(apiName, path, myInit)
like image 52
r.pedrosa Avatar answered Oct 14 '22 18:10

r.pedrosa