javascript – Flask和Ajax Post请求400

前端之家收集整理的这篇文章主要介绍了javascript – Flask和Ajax Post请求400前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在写一个小瓶子的网站,我想使用Ajax从客户端发送数据到服务器.到目前为止,我只使用Ajax请求从服务器检索数据.这一次我想通过POST请求提交数据.

这是烧瓶方面的接收器,我将其减少到几乎不记录消息,以避免在此路由的实现过程中出现任何不必要的错误

@app.route("/json_submit",methods=["POST"])
def submit_handler():
    # a = request.get_json(force=True)
    app.logger.log("json_submit")
    return {}

当提交ajax请求时,烧瓶给我一个400错误

127.0.0.1 - - [03/Apr/2014 09:18:50] "POST /json_submit HTTP/1.1" 400 -

我也可以在浏览器的Web开发者控制台中看到这一点

为什么烧瓶不会在请求中提供的数据调用submit_handler?

var request = $.ajax({
    url: "/json_submit",type: "POST",data: {
      id: id,known: is_known
    },dataType: "json",})  
   .done( function (request) {
  })

解决方法

如果您使用 Flask-WTF CSRF protection,您将需要免除您的视图或将CSRF令牌包含在AJAX POST请求中.

豁免是用装饰器完成的:

@csrf.exempt
@app.route("/json_submit",methods=["POST"])
def submit_handler():
    # a = request.get_json(force=True)
    app.logger.log("json_submit")
    return {}

要使用AJAX请求包含令牌,请将令牌内插到页面中;在< Meta>头或生成的JavaScript,然后设置一个X-CSRFToken头.使用jQuery时,请使用ajaxSetup hook.

使用元标记(来自Flask-WTF CSRF文档)的示例:

<Meta name="csrf-token" content="{{ csrf_token() }}">

并在你的JS代码中的某个地方:

var csrftoken = $('Meta[name=csrf-token]').attr('content')

$.ajaxSetup({
    beforeSend: function(xhr,settings) {
        if (!/^(GET|HEAD|OPTIONS|TRACE)$/i.test(settings.type)) {
            xhr.setRequestHeader("X-CSRFToken",csrftoken)
        }
    }
})

您的处理程序尚未实际发布JSON数据;它仍然是一个常规的url编码POST(数据将在Flask侧的request.form中结束);您必须将AJAX内容类型设置为application / json,并使用JSON.stringify()来实际提交JSON:

var request = $.ajax({
   url: "/json_submit",contentType: "application/json",data: JSON.stringify({
     id: id,known: is_known
   }),})  
  .done( function (request) {
})

现在可以使用request.get_json() method作为Python结构访问数据.

dataType:“json”,参数为$.ajax仅在视图返回JSON时才需要(例如,您使用flask.json.jsonify()生成JSON响应).它让jQuery知道如何处理响应.

猜你在找的Ajax相关文章