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.
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.Sebagai alternatif, cuma tambahkan penghurai JSON pada hujung belakang anda dan permintaan JSON mentah anda akan berfungsi, menggunakan penghurai terbina dalam: