Question

我正在尝试通过从文本区域获取数据的jquery ajax PUT来更新我的mongodb中的文件。我一直在修补这个PUT一段时间，调整内容类型，并没有得到任何地方。

当我单击文本区域的下一个按钮时，我想将输入输入到我的mongodb（通过mongoose），但我一直收到错误（在jquery / ajax代码块下面的图片中）。这可能是解析的问题吗？

HTML

 <form name="answers" method="post"> 

 <textarea rows="30" cols="150" id="editor"></textarea>

     <div class="btn-group" role="group" aria-label="...">
        <button type="button" class="btn btn-default" id='previous'>Previous</button>
        <button type="button" class="btn btn-default" id='next'>Next</button>
    </div>
 <button type="button" class="btn btn-primary btn" id='submit'>Submit</button>

 </form>

JQuery / AJAX POST

function answer() {
    var info = $('#editor').val()   // data from text area

    $.ajax({
            type: "PUT",
            url: "/tests/" + authCode,    // authCode-> global variable defined at top of page
            data: info,
            dataType: "json",                               
            contentType: "application/json",                                
            timeout: 5000,
            complete: function() {
              //called when complete
              console.log('process complete');
            },

            success: function(data) {
              console.log(data);
              console.log('process sucess');
           },

            error: function(err) {
                console.log(err);
              console.log('process error');
            },
        });
}

在Chrome控制台中，我收到以下错误：

EXPRESS

app.use(morgan('dev'));
app.use(express.static('files'));
app.use(bodyParser.json()); // to support JSON-encoded bodies
app.use(bodyParser.urlencoded({
extended: true
}));

...

app.put('/tests/:code', (req, res) => {
 res.set('Content-Type', 'html');
 console.log(req.body);    
});

req.body记录一个空对象。

network tab(dev console)

Answer 1

将JSON对象发送到NodeJS Express服务器的最小且有效的示例：

的NodeJS

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

app.use(bodyParser.json()); // to support JSON-encoded bodies

app.put("/", function(req, res) {
  console.log(req.body);
  res.send("OK");
});

app.listen(3000, function () {
  console.log('Example app listening on port 3000!');
});

Frontend JS

var req = new XMLHttpRequest;  
req.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
req.open('PUT', "/", true);  
req.send(JSON.stringify({foo:"bar"}));

您应该尝试此示例，然后逐步使用自己的用例。例如，首先使用您的jQuery代码和HTML表单进行交换。然后修改服务器代码。否则，这里的用户很难帮助您完成您的方案。

Answer 2

看起来你的错误声明后还有一个额外的逗号。它应该看起来像：

function answer() {
var info = $('#editor').val()   // data from text area

$.ajax({
        type: "PUT",
        url: "/tests/" + authCode,    // authCode-> global variable defined at top of page
        data: info,
        dataType: "json",                               
        contentType: "application/json",                                
        timeout: 5000,
        complete: function() {
          //called when complete
          console.log('process complete');
        },

        success: function(data) {
          console.log(data);
          console.log('process sucess');
       },

        error: function(err) {
            console.log(err);
          console.log('process error');
        }
    });

}

JQuery / AJAX PUT返回400错误

HTML

JQuery / AJAX POST

EXPRESS

2 个答案: