CODEWITHSUNDEEP
reactjsamazon-web-servicesnpmaws-lambdafetch
shubhamagiwal92
shubhamagiwal92

Reputation: 1432

No 'Access-Control-Allow-Origin' header is present on the requested resource using AWS API Gateway with AWS Lambda

I am using AWS API gateway with AWS Lambda in my backend. I have enabled cors for my endpoint. But when I run the endpoint on the browser I am only getting the following error

 No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Using redux thunk, my actions file is as follows

import Cookies from 'universal-cookie';
import fetch from 'node-fetch';

export function fetchUsers(){

return (dispatch) => {

  const headers={
    "Content-Type":"application/json",
    "Authorization":cookies.get('idToken')
  }

  return fetch(`${url}/accounts`,{method:"GET",headers:headers }).then(response => console.log(response));
}

I also observe that my OPTIONS and GET requests are able to give 200 OK response in the network options on the web browser. The current API takes about 11 sec to give a response.

Can somebody help me with this?

Upvotes: 0

Views: 446

Answers (1)

Adi H
Adi H

Reputation: 738

It's hard to troubleshoot without knowing what other steps you've taken but see if any of the following helps:

  1. If you've enabled CORS don't forget to perform "Deploy API". I always forget this

  2. Try including these headers properties (see below) in the lambda response if the APIGateway endpoint is configured to Use Lambda Proxy integration under Integration Request (it's a checkbox, at the time of this writing). If using other types of integrations you'll need to manually set the headers in the endpoint's response/mapping settings.

    {
    'Access-Control-Allow-Origin': '*'
    , //other optional entries here
}

Upvotes: 1

Related Questions