Tidak dapat menghantar data dari axios ke pelayan nod yang mengembalikan objek kosong-Soal Jawab Rangkaian PHP Cina

Kod pelanggan saya:

<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="form.css" />
  </head>
  <body>
    <form action="/login" method="post" class="form">
      <input type="text" name="txt" class="txt" id="txt" placeholder="name" />
      <input type="submit" class="submit" id="submit" />
    </form>
    <script defer src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
    <script>
      let submit = document.querySelector(".submit");
      const form = document.querySelector(".form");

      form.addEventListener("submit", (e) => {
        e.preventDefault();

        const formData = new FormData(form);

        const formObject = {};
        formData.forEach((value, key) => {
          formObject[key] = value;
        });

        console.log(axios.defaults)

        axios
          .post("http://localhost:8080/login", formObject)
          .then(function (response) {
            console.log(response.data);
          })
          .catch(function (error) {
            console.log(error);
          });
      });
    </script>
  </body>
</html>

Kod sisi pelayan saya:

const app = express();
const path = require("path");

app.use(express.static('./public',{index:'form.html'}));

app.use(express.urlencoded({extended:true}));

    app.post('/login',(req,res)=>{
    //const txt = req.body;
      console.log('logged data: ',req.body);
      res.send('Thanks');
    })
app.listen(8080, () => {
  console.log('server is running...in port 8080')

 });

Pertama sekali, sila ingat bahawa saya baru dalam bidang belakang. Apabila saya cuba console.log data yang dilog, ia mengembalikan objek kosong, saya tidak faham mengapa req.body saya mengembalikan objek kosong, tetapi apabila saya cuba melakukan perkara yang sama dengan memberikan tindakan:"/login" dan kaedah Bila: "siarkan" di dalam teg borang ia berfungsi seperti yang diharapkan dan memberi saya input yang saya berikan. Tolong seseorang membantu saya, kepala saya terbakar, terima kasih terlebih dahulu.

membalas semua(1)

P粉3331862852024-04-01 09:14:42 Tingkat 1

req.body 是空的，因为当您使用 axios 发送它时，您实际上发送的是 JSON (application/json) 负载，并且后端没有 JSON 负载解析器，只有 URL 编码，而HTML 表单以 application/x-www-form-urlencoded Hantar dalam format, itulah sebabnya ia berfungsi.

Jadi anda perlu menggunakan axios untuk menghantar permintaan yang dikodkan URL, anda boleh menggunakan URLSearchParams untuk menukar objek JSON kepada rentetan pertanyaan. Cuba ini.

axios
  .post("http://localhost:8080/login", new URLSearchParams(formObject))

Sebagai alternatif, cuma tambahkan penghurai JSON pada hujung belakang anda dan permintaan JSON mentah anda akan berfungsi, menggunakan penghurai terbina dalam: