如何通过制作Ajax调用将HTML表单数据发送到Node.js服务器？

Question

我希望使用Ajax将表单数据发送到node.js服务器，并且我正在按照以下方法发送数据。

但我不知道如何在node.js服务器程序中接收它，我没有使用node.js的express框架。

client.HTML

<script>
 function myFunction() {
   var region = document.getElementById("region").value;
   var os = document.getElementById("os").value;
   var data = {};
   data.region = region;
   data.os = os;
   $.ajax({
     type: 'post',
     datatype: 'jsonp',
     data: JSON.stringify(data),
     contentType: 'application/json',
     url: 'http://127.0.0.1:8083/', //node.js server is running
     success: function(data) {
       alert("success");

     }
   });

</script>
<form>
<select id="region" name="region" class="region"></select>
<select id="os" name="os" class="os"></select>  
<input type="button" value="search" class="fil_search" onclick="myFunction()"/>
</form>

server.js

var http = require('http');
var fs = require('fs');
var url = require('url');
var MongoClient = require('mongodb').MongoClient;
var assert = require('assert')
var ObjectId = require('mongodb').ObjectID;
var express = require('express');
var bodyParser = require('body-parser');
var app     = express();
var result1=[];
var result2=[];
var result3=[];
var result4=[];
var result5=[];
var result6=[];
var result7=[];
var i=0;
var region;
var os;
app.use(bodyParser.urlencoded({ extended: true })); 

MongoClient.connect("mongodb://192.168.1.22:27017/test", function(err, db) {

if(err) { return console.dir(err); }
else {
app.get('/',function(req, res) {

var url_parts = url.parse(req.url, true);
var url_parsed = url.parse(req.url, true);

"i want data here from ajax to perform"

console.log("connected");


var instance = db.collection('instance');
var region = db.collection('region');

region.findOne(({$and: [{"region_name": region_name},{"os_type": os}]}), function(err, result){
if(err){    
throw(err);
}
else{
console.log(region);
var newr = result.inst_name;

instance.find({ "inst_id": { "$in": newr } }).toArray(function(err, resultn){
if(err){
throw(err);
}
else{       
    var len=resultn.length;

    console.log(resultn);
    console.log(len);

    for(var i=0;i<len;i++)
    {
        result1[i]=resultn[i].inst_type;
        result2[i]=resultn[i].vcpu;
        result3[i]=resultn[i].memory_gib;
        result4[i]=resultn[i].storage;
        result5[i]=resultn[i].phy_processor;
        result6[i]=resultn[i].clock_spd;
        result7[i]=resultn[i].netwk_pef;            
    }
    var wstream = fs.createWriteStream('myOutput.txt');
    wstream.write(result1.toString()+"~"+result2.toString());       
    //var str = "Hi man"
    res.writeHead(200, {'Content-Type':'text/html'});
    //res.end(url_parsed.query.callback+'("'+resultn.toString()+'")'); 
    res.end(url_parsed.query.callback+'("'+result1.toString()+"~"+result2.toString()+"~"
    +result3.toString()+"~"+result4.toString()+"~"+result5.toString()+"~"+result6.toString()
    +"~"+result7.toString()+'")');      
}
});
}
}); 
}).listen(process.env.PORT || 8083);

}
});

我不知道如何在node.js服务器程序中接收数据，并在接收到数据后进行处理，然后将处理后的数据发送回同一HTML页面。

- Rapid

---

这是你的实际代码吗？在服务器和客户端代码中都存在语法错误，这将完全阻止代码运行。你说“我没有使用express”，但是app.use(bodyParser.urlencoded({ extended: true }));看起来像是express，所以你应该告诉我们你使用的是哪个框架而不是express。 - t.niese

这是我的实际代码，但我已经粘贴了我想从HTML表单发送和接收数据的重要部分。我想知道如何在Node.js服务器中获取数据的解决方案？ - Rapid

好的，但是你在这里有一个语法错误 '("' + result1.toString()'");，所以你的服务器代码根本无法运行。而且你在客户端的 myFunction 函数末尾缺少一个 }，所以这段代码也无法运行。你还没有告诉我们你使用的框架是什么，而不是 express。如果 app 不是一个 express 应用程序，那它是什么？ - t.niese

@t.niese 请再次检查我的程序，我已经上传了完整的工作程序，请给我解决方案。如何在node.js服务器上接收数据，并希望查询它并再次将数据发送回该HTML页面。 - Rapid

请有人帮我解决这个问题。提前致谢。 - Rapid

Answer 1

如果您在server.js文件中有app.use(bodyParser.urlencoded({ extended: true }));，那么您可以使用bodyParser从ajax中检索数据，如下所示：

app.post('/', function(req, res) { //your ajax should also post to url: '/'
    var region = req.body.region,
    os = req.body.os;
    // ...
});

- RegarBoy