javascript - NEXT JS req.body undefined

Question

不确定我做错了什么？

当我试图将我的表单数据上传到我的 supabase 时，我变得不确定，数据正在进入未定义的 API，但是当我将它传递给函数时，它会在我的提交处理程序中打印我想发送到 API 的内容。

export const Quote = () => {
  const [formIsValid, setFormIsValid] = useState(false);
  //----------------------------_FORM VALIDATION------------------------------------
  const {
    value: firstName,
    inputBlurChangeHandler: firstNameBlur,
    isValid: firstNameValid,
    hasError: firstNameInputHasError,
    valueChangeHandler: firstNameChangeHandler,
    reset: resetFirstName,
  } = useInput((value) => value.trim() !== "");



**hooks & useEffect removed to shorten question they are same as above but different names**

  console.log(formIsValid, "FORM IS VALID");


  const formSubmitHandler = async (event) => {
    event.preventDefault();

    //UNDEFINEDS
    await fetch("api/dbhandler", {
      method: "POST",
      body: {
        firstname: firstName,
        secondname: secondName,
        street: streetAddress,
        phone: phoneNumber,
        email: emailAddress,
        postal: postalCode,
        about: quoteDescription,
      },
      headers: {
        "Content-Type": `text/plain`,
      },
    });
  };

API 在请求中未定义。正文，但如果我在控制台登录，提交处理程序值被传递给函数，我不确定我做错了什么

import { supabase } from "../../utils/supabaseClient";

const supabaseApiHandler = async (req, res) => {
  console.log(req.body.firstname);
  if (req.method === "POST") {
    const firstname = req.body.firstname;
    const secondname = req.body.secondname;
    const email = req.body.email;
    const street = req.body.street;
    const postal = req.body.postal;
    const phone = req.body.phone;
    const about = req.body.about;

    const { data, error } = await supabase.from("quotes").insert([
      {
        firstname,
        secondname,
        email,
        street,
        postal,
        phone,
        about,
      },
    ]);
  }

  res.status(200).json({ name: "test" });
};

export default supabaseApiHandler;

Answer 1

如果您在 API 路由中禁用了主体解析器，则 req.body 将为空。

我在没有使用其他正文解析器的情况下不小心遗漏了这段代码。

export const config = {
  api: {
    bodyParser: false,
  },
};