阿賈克斯後的數據發送給快遞JS身體解析器

我特林通過Ajax表單數據發送到節點JS，
我使用快遞與身體解析器節點JS
但我正在逐漸未定義的REQ。身體阿賈克斯後的數據發送給快遞JS身體解析器

我搜索了每一個網絡，並嘗試了很多東西，沒有爲我工作請幫助我正確的方式做到這一點。

| * | HTML代碼：

<html lang="en"> 
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <title>Add</title> 
</head> 
<body> 

    <h1>Welcome to Website </h1> 
    <form id="addUserForm"> 
     <h3> Enter the your details : </h3> 
     Name :<br><input type="text" name="nameView"><br><br> 
     Email :<br><input type="email" name="mailView"><br><br> 
     Mobile :<br><input type="number" name="mobileView"><br><br> 
     <input type="submit" value="Submit"> 
    </form>

| * | Ajax代碼：

<script> 
     $(document).ready(function() 
     { 
      $('#addUserForm').submit(function() 
      { 
       var formDataVar = new FormData($(this)[0]); 

       console.log(formDataVar); 
       $.ajax({ 
        url: '/addUserFormSubmit', 
        type:'POST', 
        data: formDataVar, 
        dataType: 'json', 
        contentType: false, 
        processData: false, 
       }).done(function(ResJryVar) 
       { 
        console.log(ResJryVar); 
       }); 
      }) 
     }); 

    </script> 
</body> 

</html>

| * |我也試過：

var formDataVar = new FormData(); 
formDataVar.append('nameView', input.files[0]); 
formDataVar.append('mailView', input.files[1]); 
formDataVar.append('mobileView', input.files[2]);

和

var formDataVar = {}; 
$.each($('#addUserForm').serializeArray(), function(i, field) 
{ 
    formDataVar[field.name] = field.value; 
});

| * |節點JS代碼：

var express = require("express"); 
var bodyParser = require("body-parser"); 
var app = express(); 

app.listen(8888,function() 
{ 
    console.log("Server Started and Running ..."); 
}); 

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

app.get('/',addUserFormFnc); 
app.post('/addUserFormSubmit',addUserSubmitFnc); 

function addUserFormFnc(req, res) 
{ 
    res.sendFile('addUser.html', {root: __dirname }); 
} 

function addUserSubmitFnc(req, res) 
{ 
    console.log("Data Received : "); 
    var userObjVar = 
    { 
     nameView: req.body.nameView, 
     mailView: req.body.mailView, 
     mobileView: req.body.mobileView 
    }; 
    console.log(userObjVar); 
    res.send(userObjVar); 

}

來源

2017-09-22 Sujay U N

如果你有url編碼數據，它應該在req.body上可用，而不是req.data。對於多部分/表單數據，請查看Muller中間件包。 – djfdev

抱歉編輯我的問題。它的要求。我只是使用表單。 action ='/ addUserFormSubmit'的作品。但是當我從阿賈克斯發送，它不會工作 –

身體解析器庫沒有處理好與multipart/form-data編碼數據。如果你想發送這種類型的數據，你應該使用類似multer中間件。

但在你的情況下，我認爲你可以逃脫，而不必使用FormData接口。你可以重寫你的瀏覽器代碼，如下：

const $form = $('#addUserForm') 

$form.on('submit', submitHandler) 

function submitHandler (e) { 
    e.preventDefault() 

    $.ajax({ 
    url: '/addUserFormSubmit', 
    type:'POST', 
    data: $form.serialize() 
    }).done(response => { 
    console.log(response) 
    }) 
}

來源

2017-09-22 21:16:58 djfdev

你可以給一個解釋如何使用multer只有領域。該文檔僅解釋有關文件。 –

下面是一個完整的工作示例https://gist.github.com/djfdev/750f2255e2f6f72b2ca5e0636f13d990 – djfdev

根據multer文檔，任何文本字段都將作爲'req.body'的屬性提供。但是，除非你發送文件，否則你不需要使用這個庫。 – djfdev

阿賈克斯後的數據發送給快遞JS身體解析器

回答

相關問題