Access-control-allow-origin is not allowed by Access-Control-Allow-Headers in preflight response

Question

I have prepared an Lambda function using Express(node.js) and enabled the Authorization with IAM as well.

The API is working in the Postman as per below link : https://www.youtube.com/watch?v=KXyATZctkmQ&t=35s

As I'm fairly new with CORS policy and API concepts. I'm trying to access the sample using Ajax call.

So far I have prepared the Authorization Header as per documentation and few reference.

Git Repo Link : https://github.com/mudass1r/aws-iam-authorization.git

Reference Link for Signature Generation : https://gist.github.com/davidkelley/c1274cffdc0d9d782d7e

I have Enabled the CORS from AWS API Gateway for my API as well.

PS : The API is Deployed using Serverless Framework.

Step 1 : The error I'm facing initial when I dont include any headers:

Step 2 : Later when I add headers:

$.ajax(Signer(credentials, {
  url: <AWS API URL>,
  type: 'GET',
  dataType: 'json',
  async: true,
  crossDomain: true,
  contentType: 'application/json',
  headers: {
    "Access-Control-Allow-Origin" : "*"
  },
  success: function(data) {
    console.log(data);
  }
}));

After which I get the following error:

In my previous experience with this error we only need to enable the CORS for the API which resolves this issue. But the same is not in this cases. Following is the structure of the API resource.

I have been stuck in this problem for few day and came across some CORS policy reference links as well. https://fetch.spec.whatwg.org/#http-cors-protocol

Thanks everyone for your inputs and help.

Answer 1

Answer :

First of all the problem was not in header content. It was in the Authorization String which I was generating for AWS API Gateway authorization.

As pointed by @sideshowbarker. We don't need to add any headers in the ajax call.

The response header are enough to handle the API call.

app.use(cors())

app.use((req, res, next) => {
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.header('Access-Control-Allow-Headers', 'Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method,X-Access-Token,XKey,Authorization');
    next();
});

Also I switched to Firefox for debugging the API call, where I found following errors.

Because I switched to Firefox, I could see the response from AWS from which I could further debug and fix the issue.

Issue in the CanonicalRequest function :

Before

'content-type;host;x-amz-date;'

After

'content-type;host;x-amz-date'

Thanks everyone for your inputs and help.

I have updated the git repo. Please refer the same. https://github.com/mudass1r/aws-iam-authorization