Cross origin request block

Question

I am working on angular fronted project and using angular7 project. I am using aws api as backend. Whenever I call the aws api its giving me following errors.

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://xxxxxxx.execute-api.us-east-1.amazonaws.com/XXX/subscriptionpayment. (Reason: missing token ‘access-control-allow-origin’ in CORS header ‘Access-Control-Allow-Headers’ from CORS preflight channel).

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://xxxxxxx.execute-api.us-east-1.amazonaws.com/XXX/subscriptionpayment. (Reason: CORS request did not succeed).

I am using following code

const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type':  'application/json',
    'Access-Control-Allow-Origin':'*'
  })
};

     let makePaymentUrl = "https://xxxxx.execute-api.us-east-1.amazonaws.com/xxxx/subscriptionpayment";
return this.http.post(makePaymentUrl, params,httpOptions);

Pubudu Jayawardana Pubudu Jayawardana · Accepted Answer · 2019-07-23T08:24:05

You need to enable CORS in the API gateway end point. Follow : https://docs.aws.amazon.com/apigateway/latest/developerguide/how-to-cors.html#how-to-cors-console

Cross origin request block

2 Answers