Amazon web services – How to get the response data from AWS Lamda function using api gateway?

It looks like you are on the right track with your Lambda function and fetch setup. However, there are a couple of things you might need to adjust in order to properly receive the JSON response from your Lambda function.

1. CORS Mode: In your fetch request, you’ve set mode: "no-cors". This mode restricts the information returned by the response. To receive the JSON data, you need to remove this line or set it to mode: "cors" if your Lambda function’s API allows CORS.

2. Response Handling: You are using .json() to parse the response, which is the correct approach. The issue might be related to the headers or CORS configuration.

Here’s an updated version of your fetch code:

fetch(`${APP_ROOT_API_URL}/SimpleArray`, {
    method: "POST",
    headers: {
        Accept: "application/json",
        "Content-Type": "application/json",
    },
})
.then((resp) => {
    if (!resp.ok) {
        throw new Error("Network response was not ok");
    }
    return resp.json();
})
.then((data) => {
    console.log(data);
})
.catch((error) => {
    console.error("Fetch error:", error);
});

Updated handler:

export const handler = async (event) => {
  try {
    const responseArray = [
      { name: "Item 1", value: 100 },
      { name: "Item 2", value: 200 },
      { name: "Item 3", value: 300 }
    ];

    return {
      statusCode: 200,
      headers: {
        "Access-Control-Allow-Headers": "Authorization, Content-Type",
        "Access-Control-Allow-Origin": "*",
        "Access-Control-Allow-Methods": "POST, OPTIONS"
      },
      body: JSON.stringify(responseArray)
    };
  } catch (error) {
    return {
      statusCode: 500,
      headers: {
        "Access-Control-Allow-Headers": "Authorization, Content-Type",
        "Access-Control-Allow-Origin": "*",
        "Access-Control-Allow-Methods": "POST, OPTIONS"
      },
      body: error
    };
  }

};

A couple of things to note:

• I’ve added an error handling mechanism using .catch() to catch any network-related errors.
• I’ve also added a check using if (!resp.ok) to handle cases where the response is not successful (e.g., non-200 status codes).

Make sure that your Lambda function’s API has the necessary CORS configuration to allow your JavaScript client to make requests to it. This often involves setting appropriate headers in your Lambda function’s response to handle cross-origin requests.

If you still encounter issues, double-check your Lambda function’s logs for any errors or additional information that might help diagnose the problem.