在 onsubmit 函数调用中出现未定义的对象变量答案

【问题标题】：Object Variable coming up undefined in onsubmit function call在 onsubmit 函数调用中出现未定义的对象变量
【发布时间】：2017-09-21 09:13:05
【问题描述】：

重定向函数在提交表单时被调用，并且由于某种原因数据对象没有被携带到函数中并开始在 ajax 发布请求上传递。到调用数据对象时，它具有 6 个属性。快递的邮寄路线有效并且成功，但我无法获取要发送的数据对象。

感谢任何帮助，谢谢。

这部分是express代码，下面是app.js

const bodyParser = require('body-parser');
const jsonParser = bodyParser.json({ type: 'application/json' });
hbs.registerPartials(__dirname + '/views/partials');
app.set('view engine', 'hbs');
app.use(express.static(__dirname + '/views'));



app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});

app.post('/Summary',jsonParser, function (req, res) {
    console.log("post"+ req.body + ' h');
    res.send(req.body);
});

//////// App.js 代码 /////

 var data = {roommate:1};


function redirect(){

    var data=JSON.stringify(data);
    console.log(data +' f');
$.ajax({
                        type: 'POST',
                        data: data,
                        contentType: 'application/json',
                        url: 'http://localhost:3000/Summary',                       
                        success: function(data) {
                            console.log('success');
                            console.log(JSON.stringify(data + 'h'));
                        }
                    });

};

【问题讨论】：

你有没有尝试发送x-www-form-urlencoded而不是JSON字符串到服务器
我没有做表格，因为我必须在提交之前将每个值附加到一个对象
jQuery 接受对象，默认情况下会将它们转换为 x-www-form-urlencoded，这可能也是您的 bodyParser 所期望的，您唯一需要做的就是不将对象字符串化，而不是设置contentType 标头
我做了这些更改，但仍然没有得到我需要的东西 =/

标签： javascript jquery express

【解决方案1】：

您的原始代码非常接近工作。

我看到的主要问题是：

var data = {roommate:1};

function redirect(){
    var data=JSON.stringify(data);

您有两个名为data 的变量，一个在函数外部声明，一个在函数内部声明。虽然两者都可以，但进行 JSON 编码的行将只能看到局部变量，而不是外部变量。最简单的解决方法是重命名其中一个变量，但您可能还想考虑将数据作为参数传递给 redirect 函数，而不是依赖于从外部获取它。

除了日志记录之外，您的服务器代码看起来还不错。此行不会记录任何特别有用的内容，因为它使用字符串连接：

console.log("post"+ req.body + ' h');

req.body 是一个对象，像这样连接它只会给你post[object Object] h。而是尝试这样的事情：

console.log("post", req.body, ' h');

除了你的服务器应该没问题。

回到客户端代码，success 处理程序中的日志记录有点偏离：

console.log(JSON.stringify(data + 'h'));

这是一个 data 对象，将其与 h 连接以提供 [object Object]h，然后尝试对该字符串进行 JSON 编码。而是尝试这样的事情：

console.log(data, 'h');

或者，如果您愿意，可以这样：

// Note the 'h' is outside the stringify
console.log(JSON.stringify(data) + 'h');

虽然当前代码确实有效，但如果您期望 JSON 响应，您可能会考虑使用 $.getJSON 而不是 $.ajax。

【讨论】：