尝试将 Web 表单数据发布到 DynamoDB 时"Unexpected token Z in JSON at position 0"



我正在创建一个带有web表单的应用程序,当用户单击"提交"时,数据被添加到DynamoDB表中。

我的web表单的HTML代码包括一个API(使用API Gateway创建),它触发一个Lambda函数,该函数应该解析数据并将其放在DynamoDB中。然而,当我提交web表单时,我得到了一个Unexpected token Z in JSON at position 0错误。

下面是我的HTML代码:

<!DOCTYPE html>
<html lang="en-US">
  <body>
    <p>Sign-Up Form</p>
    <form action="https://XXXXXXXXXX.execute-api.us-east-1.amazonaws.com/Prod/submit" method="post">
      <ul>
        <li>
          <label for="first_name">First Name:</label>
          <input type="text" id="first_name" name="first_name" required>
        </li>
        <li>
          <label for="last_name">Last Name:</label>
          <input type="text" id="last_name" name="last_name" required>
        </li>
        <li>
          <label for="mail">E-mail:</label>
          <input type="email" id="mail" name="user_email" required>
        </li>
        <li>
          <label for="region">Which region are you based in?</label>
          <select name="region" id="region" required>
            <option value="">--Select--</option>
            <option value="emea">EMEA</option>
            <option value="amer">AMER</option>
            <option value="apj">APJ</option>
          </select>
        </li>
        <li class="button">
          <button type="submit">Submit Sign-Up Form</button>
        </li>
       </ul>
    </form>
  </body>
</html>

这是我的Lambda函数:

const AWS = require("aws-sdk");
const dynamo = new AWS.DynamoDB.DocumentClient();
exports.handler = async (event, context) => {
  let body;
  let statusCode = 200;
  const headers = {
    "Content-Type": "application/json"
  };
  try {
    switch (event.routeKey) {
      case "POST /items":
        let requestJSON = JSON.parse(event.body);
        await dynamo
          .post({
            TableName: "XXXXXX",
            Item: {
              first_name: requestJSON.first_name,
              last_name: requestJSON.last_name,
              user_email: requestJSON.user_email,
              region: requestJSON.region
            }
          })
          .promise();
        body = `Put item ${requestJSON.user_email}`;
        break;
      default:
        throw new Error(`Unsupported route: "${event.routeKey}"`);
    }
  } catch (err) {
    statusCode = 400;
    body = err.message;
  } finally {
    body = JSON.stringify(body);
  }
  return {
    statusCode,
    body,
    headers
  };
};

编辑我没有经历创建自己的API和编写Lambda函数的复杂过程,而是遵循了这个很棒的无服务器表单教程。

表单不以JSON格式发送数据。表单发送application/x-www-form-urlencode内容类型。您可以使用URLSearchParams对象来处理表单数据。

相关内容

最新更新