Question 275157 in Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – How to get Lambda's response from React Axios

I have the app setup like below and I want to get the Lambda’s response through API to show the item list in web.

User <-> API Gateway <-> Lambda <-> DynamoDB

Below is the example of code I’m using.

// React component
async handleSubmit(event) {
    event.preventDefault();
    const res = await axios.post('https://***.execute-api.us-east-1.amazonaws.com/default/functionName', {})
    console.log(res)
}

// It returns "null" and nothing in Payload.

// Lambda Function
client = boto3.client('dynamodb', region_name='us-east-1')
data = client.scan(TableName='myTable');
response = {
    'statusCode': 200,
    'body': json.dumps(data),
    'headers': {
        'Content-Type': 'application/json',
        'Access-Control-Allow-Origin': '*'
    },
}
return response;


// Lambda Function Test response is;
{
  "statusCode": 200,
  "body": "{"Items": [{"date": {"N": "123"}, "message": {"S": "msg"}}....], "Count": .....",
  "headers": {
    "Content-Type": "application/json",
    "Access-Control-Allow-Origin": "*"
  }
}

In Lambda, I can get the list of DynamoDB items in JSON format without issue. Do you have any idea why I get "Null" in React? What am I missing?

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I found the issue was from my API Gateway setup. I created an HTTP API, set Route with GET method with Lambda function integration. It works!


  2. 0

    Just as you do in the React side, you need to properly handle the promise on
    the Lambda side. Something more like:

    client = boto3.client('dynamodb', region_name='us-east-1')
client.scan(TableName='myTable', function(err, data) {
    if(err) {
        // log error
    }
    else {
        response = {
            'statusCode': 200,
            'body': json.dumps(data),
            'headers': {
                'Content-Type': 'application/json',
                'Access-Control-Allow-Origin': '*'
             }
        }
        return response;
   }
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search