Question

我试图获取一个表单来向我的express app.js提交一些数据而不重新加载页面。我以为我有正确的代码但是当从ajax调用到服务器获取代码时，我得到一个未定义的数据变量。

app.js :(删除不相关的行）

var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

var index = require('./routes/index');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

// uncomment after placing your favicon in /public
app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.get('/web_text.json',function(req, res, next){
    res.sendFile(__dirname + '/web_text.json');
});

app.post('/sendEmail', function (req, res) {

    console.log(req.body.data);

});

app.use('/', index);

module.exports = app;

进行ajax调用的jquery函数：

$('#reserve form').on('submit', function(){

    event.preventDefault();
    var data = {

        name: $('#name').val()
    };
    console.log(data);
    $.ajax({
        url: 'http://localhost:3000/sendEmail',
        data: data,
        method: 'POST'
    }).then(function (response) {
      // Do stuff with the response, like add it to the page dynamically.
      $('body').append(response);
    }).catch(function (err){

        console.error(err);
    });
});

注意我的/ sendEmail app.post函数中的console.log（）和jquery函数中的一个。 jquery one记录正确的数据，而app.post记录一个未定义的变量...我做错了什么？提前谢谢

Answer 1

你的jQuery不是POST JSON，而是发送一个JS对象。我愿意打赌这是一个内容类型的问题。您可能还需要查看$('#reserve-form').serialize()来打包表单数据以进行发送，而不是尝试手动创建对象。

Answer 2

在您的app.js中，您没有发送回复。这就是为什么你得到未定义的输出。试试这个

app.post('/sendEmail', function (req, res) {
    console.log(req.body.data);
    res.jsonp({data: 'your data'});
});

希望这会对你有所帮助。

jquery ajax发布表达服务器获取未定义的数据

2 个答案: