javascript - AJAX 没有正确解析 url

Question

我有一个 HTML 表单，我想将其提交到 Flask 端点/add_int。提交表单后，我使用 Jquery 拦截它并使用 AJAX 将表单提交到端点，如下所示:

var form = $( this ).serialize()

$.post({                           
   url: "{{ url_for('add_int') }}",
   data: JSON.stringify(form),
   contentType: 'application/json;charset=UTF-8',       
   success: function(resp) {
       console.log(resp);
   }
 });

端点看起来像这样:

 @app.route('/add_int', methods=['GET', 'POST'])
 @login_required
 def add_int():
    # do stuff
    return jsonify(status="success!")

我的问题是我从来没有到达终点。

当我检查我的控制台时，我看到了

POST http://127.0.0.1:5000/[object%20Object] 404 (NOT FOUND) 

代替

POST http://127.0.0.1:5000/add_int

如我所料。

注意如果我设置

url: '/add_int',

我遇到了同样的问题。

我发现使用几乎相同代码但未提及此问题的案例:例如how can I use data posted from ajax in flask?

我的猜测是我的 url 被解析为 String 对象而不是 url，但我不明白为什么会这样，也不知道如何解决它。

这是怎么回事？

Answer 1

您应该删除对 JSON.stringify 的调用，您可以将序列化表单直接作为 POST 数据传递，JSON.stringify 会将您的对象转换为 [对象对象].

url: '/add_int', 不起作用，因为(看起来)您的前端运行在与后端不同的端口上，因此它将被拒绝为“跨域”要求。您是否检查过 "{{ url_for('add_int') }}" 返回的值？