0

I am making a lambda function that stores a object to Atlas db.
When I send request with postman, everything is fine. But when I send from my gatsby client I can not see the response data.

fetch(
  "LAMBDA_URL",
  {
    method: "post",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json",
    },
    body: JSON.stringify(payload),
    mode: "no-cors",
  }
)
  .then(function (response) {
    if (response.status !== 200) {
      console.log(
        "Looks like there was a problem. Status Code: " + response.status
      )
      return
    }
    response.json().then(function (data) {
      console.log(data)
    })
  })
  .catch(function (err) {
    console.log("Fetch Error :-S", err)
  })

I can see the request firing and the object looks fine and all. And the response I get from function is a 200

This is the code from my lambda function:

module.exports.create = (event, context, callback) => {
  context.callbackWaitsForEmptyEventLoop = false;

  const body = JSON.parse(event.body);

  if (
    !body ||
    !body.category ||
    !body.seed ||
    !body.email ||
    !body.description ||
    !body.recaptcha
  ) {
    callback(null, {
      statusCode: 400,
      body: 'Bad request',
    });
  }

  const { ['recaptcha']: captchaResponse, ..._seed } = body;

  // Validate the recaptcha
  const captcha = new googleRecaptcha({
    secret: process.env.RECAPTCHA_SECRET_KEY,
  });

  captcha.verify({ response: captchaResponse }, (error) => {
    if (error) {
      callback(null, {
        statusCode: error.statusCode || 500,
        headers: { 'Content-Type': 'text/plain' },
        body: JSON.stringify(error),
      });
    }
  });

  connectToDatabase().then(() => {
    Seed.create(_seed)
      .then((seed) =>
        callback(null, {
          statusCode: 200,
          body: JSON.stringify(seed),
        })
      )
      .catch((err) =>
        callback(null, {
          statusCode: err.statusCode || 500,
          headers: { 'Content-Type': 'text/plain' },
          body: 'Could not create the seed.',
        })
      );
  });
};

I can see my data getting stored in db, so at least that is working for me. :)

John Rotenstein
  • 241,921
  • 22
  • 380
  • 470
Jedi Schmedi
  • 746
  • 10
  • 36
  • are you getting response null / CORS error? – Akash Bhandwalkar Apr 13 '20 at 08:14
  • 1
    By specifying 'no-cors' mode, you’re explicitly telling the browser to block your frontend JavaScript code from accessing the response. – sideshowbarker Apr 13 '20 at 08:30
  • I removed the no-cors, and I set the lambda to cors:true. Now it works in postman and still not in browser . This is my fetch request: fetch( LAMBDA_URL, { method: "post", headers: { "Content-Type": "application/json", "Access-Control-Allow-Origin": "*", }, body: JSON.stringify(payload), } ) – Jedi Schmedi Apr 13 '20 at 10:30
  • Error I get is: blocked by CORS policy: Request header field access-control-allow-origin is not allowed by Access-Control-Allow-Headers in preflight response. – Jedi Schmedi Apr 13 '20 at 10:31
  • Solved it, I was missing Access-Control-Allow-Origin in response – Jedi Schmedi Apr 13 '20 at 12:26

0 Answers0