通过html形式发送数据（POST方式）

Question

我有一个关于 POST 方法的问题。 我正在尝试将表单中的数据记录到 txt 文件中。 但是字符串是空的（在txt文件中我只有“请求：”）

HTML：

  <form
    action=""
    method="POST"
    id="form"
    class="section-contact-me-form"
  >
    <fieldset>

      <div class="section-contact-me-input">
        <label class="section-contact-me-input__label" for="name">Name*</label>
        <input
          type="text"
          name="name"
          class="section-contact-me-input__input _req"
          id="name"
        >
      </div>

      <div class="section-contact-me-input">
        <label class="section-contact-me-input__label" for="email">E-mail*</label>
        <input
          type="text"
          name="email"
          id="email"
          class="section-contact-me-input__input _req _email"
        >
      </div>

      <div class="section-contact-me-input">
        <label class="section-contact-me-input__label" for="phone">Phone</label>
        <input
          type="text"
          name="phone"
          id="phone"
          class="section-contact-me-input__input phone"
        >
      </div>

      <div class="section-contact-me-textarea">
        <label class="section-contact-me-textarea__label" for="message">Your message*</label>
        <textarea
          rows="10"
          cols="45"
          name="message"
          id="message"
          class="section-contact-me-textarea__textarea _req"
        ></textarea>
      </div>

    </fieldset>
    
    <div id="submit" class="submit-button">
      <button class="submit-button_active">Send data</button>
    </div>

  </form>

JS：

form.addEventListener("submit", formSend);

async function formSend() {

    const formData = {
      name: document.querySelector("#name").value,
      email: document.querySelector("#email").value,
      phone: document.querySelector("#phone").value,
      message: document.querySelector("#message").value
    };

    const formDatatoSend = JSON.stringify(formData)

    sendData("http://localhost:3000/101_susov_newDesign/contactme.php", formDatatoSend)
      .then(() => {
        form.reset();
      })
      .catch((err) => console.log(err))
};

const sendData = async (url, data) => {
  const response = await fetch (url, {
    method: "POST",
    body: data
  })

  if (!response.ok) {
    throw new Error (`URL with error ${url}, status ${response}`)
  };

  return await response;
};

PHP：

<?php
    $value = $_POST['value'];

    $f = fopen('file.txt', 'a+');
    fwrite($f, "The request: ".$value."\n");
    fclose($f);
?>

因此，服务器工作正常：每次使用表单按钮时都可以访问 php 代码和 txt 文件刷新，但从表单发送的内容为空。 正如我之前在 txt 文件中所说，我只有“请求：”

我的代码中的错误在哪里？ 提前致谢，祝您有美好的一天！

Answer 1

您没有名为value的字段，因此$_POST['value']不会返回任何内容。 您可以通过将其名称属性添加为数组键来获取每个字段的值：

• $value = $_POST['phone']会将“ The request: PHONE_NUMBER ”返回到您的 TXT 文件中。

• $value = json_encode($_POST)会将整个帖子返回到您的 TXT 文件中

这应该有效：

$value = json_encode($_POST);