jquery - Tornado 无法读取 json ajax 请求

Question

使用 ajax 我正在尝试将数据发送到我的 Tornado 服务器，这是我的 JQuery:

$("#addTask").submit(function(e){
    e.preventDefault();
    var add = $('#addProject').val();
    var added={projectAdded:add};
      $.post("/task",
              JSON.stringify(added),
        function(data){
            window.location.reload(true);
              });
    });

$('#addProject').val(); 的值来自输入文本字段:

$('<div class="input-group col-sm-7"><input type="text" form="task" class="form-control" id="addProject" name="projectAdd" value="" placeholder="New tag">
<button type="submit" name="addTag" value="addTag" form="task" id="addTask"></button>  </div>').appendTo('#proj');

在我的 Tornado 服务器中我有:

 class TaskAddHandler(BaseHandler):
    def post(self):
        addProj = json.loads(self.request.body)       
        print 'NEW TASK', addProj

但这给了我错误:raise ValueError("No JSON object could be decoded")
ValueError:无法解码 JSON 对象，而不是输入文本字段的值。

Answer 1

数据在 self.request.arguments 中。此外，您需要向客户端返回有效的 json。

class AjaxHandler(tornado.web.RequestHandler):

    def post(self):
        my_data = self.request.arguments['test_data']
        # do something with my_data 
        self.write(json.dumps({'status': 'ok'}))
        self.finish()

处理程序的 self.write(json.dumps({'status': 'ok'})) 响应对于完成与客户端的事务是必要的:任何有效的 json 都可以；内容是什么并不重要。 (如果客户端似乎没有取回 json，请参阅 this answer。)

也可能是 run_server.py 中 settings 中的 _xsrf_cookies: True。如果是这种情况，ajax 请求本身将被 Tornado 阻止(您将在控制台上看到 400 Bad Request)。

为了解决这个问题，“XSRF token 可能...通过名为 X-XSRFToken 的 HTTP header 传递，”说doc .通过self.xsrf_token 包含或调用该ajax 逻辑的任何页面的get 设置cookie。文档说，这样做“足以将 cookie 设置为副作用”:

class PageHandler(tornado.web.RequestHandler):
    def get(self):
        self.xsrf_token
        self.render('page.html')

然后可以在客户端中获取 cookie(这里通过 jQuery $.cookie plugin ):

var token = $.cookie('_xsrf');

在调用中将 token 作为自定义 headers 参数嵌入:

$.ajax({
    url: '/task',
    headers: {'X-XSRFToken' : token },
    data: {'test_string': 'test success'},
    dataType: "JSON",
    type: "POST",
    success: function ( data , status_text, jqXHR) {
        alert('ajax success')
    },
    error: function ( data , status_text, jqXHR ) {
        alert('ajax fail')
    },
});

或者，您也可以将其作为data 中的字段之一。 (如果您正在 ajax 将 JavaScript 对象作为您的字段之一，您应该 JSON.stringify 它以获得一个很好的-返回服务器端的结构化 dict:

var packet = {"_xsrf": $.cookie("_xsrf"), "test_string": "test success", "js_obj": JSON.stringify(js_obj)}; 

$.ajax({
    url: '/task',
    data: packet,
    dataType: "JSON",
    type: "POST",
    success: function ( data , status_text, jqXHR) {
        alert('ajax success')
    },
    error: function ( data , status_text, jqXHR ) {
        alert('ajax fail')
    },
});

在sample chat app中还有一个管理_xsrf_cookies的例子。在 doc 中提及.