JQuery Ajax不能与ExpressJS一起使用

我试图在客户端使用JQuery向服务器发送数字,并在服务器端收到NOde.JS和ExpresJS。

这是客户端代码:

var value = $(object.selectId()).val(); alert("Uploading " + value); $.ajax({ type: 'POST', data: JSON.stringify({ num : value }), contentType: 'application/json', url: '/testData', success: function (data) { alert('Successfully uploaded : ' + value + " and received " + JSON.parse(data).num); } } 

这是服务器代码:

 app.post('/testData', function (req, res) { var x1 = req.num console.log("Got number : " + x1); var x = JSON.stringify({ num: (x1) }); res.send(x);}); 

服务器接收“未定义”,客户端也接收回来。

你可以尝试在服务器端记录req.bodyconsole.log(req.body);变量num将作为req.body.num而不是req.num

而不是express.bodyParser()express.multipart()中间件,您应该使用formidable或任何其他模块来解析传入的表单。

我正在共享一些代码片段,以便在服务器端使用formidable基于ajax的文件上传工作。 我们还需要jQuery Form Plugin 。

创建一个示例html表单;

 

添加一些客户端javascript来处理ajax uplaods。 假设你已经加载了jQuery和jQuery表单js。

 var $form = $("#fileUploadForm"); $form.submit(function (e) { // perform client side validations if any $(this).ajaxSubmit({ error: function () { // handle error }, success: function (response) { // handle success } }); // Important: stop event propagation return false; }); 

在服务器端,添加文件上传后路由。

 var upload = require('./upload'); app.post('/upload', upload.parse, upload.save, upload.respond, upload.errors); 

创建upload.js来处理文件上传。

 var fs = require('fs'); var util = require('util'); var path = require('path'); var formidable = require('formidable'); var upload = { parse: function parse(req, res, next) { var form = new formidable.IncomingForm(); form.encoding = 'utf-8'; form.uploadDir = process.env.TMP || process.env.TMPDIR || process.env.TEMP || '/tmp' || process.cwd(); form.keepExtensions = true; form.type = 'multipart'; form.parse(req, function (err, fields, files) { req.files = files; next(err); }); }, save: function save(req, res, next) { // validate if upload was successful if (!req.files || !req.files.userfile) return next(new Error('Upload data not received, can\'t proceed.')); var userfile = req.files.userfile; // examine this object for available attributes console.log(userfile); // ensure public/data dir exists var dataDir = 'public/data'; var target = path.join(dataDir, userfile.name); fs.rename(userfile.path, target, function (err) { req.uploadLink = target.replace(/public/gi, ''); next(err); // cleanup fs.unlink(userfile.path, function () {}); }); }, respond: function respond(req, res, next) { var response = { result: 'success', upload: req.uploadLink, message: 'File uploaded!' }; res.status(200).json(response); }, errors: function errors(err, req, res, next) { console.log(err); var response = { status: 'failure', message: 'File upload failed!' }; res.status(400).json(response); } }; module.exports = upload; 

希望这有帮助,您可以更新代码以满足您的需求。 如果需要任何澄清,请告诉我。

美好的一天!