AJAX無法正確解析網址

Question

我有一個要提交給Flask端點/ add_int的HTML表單。 提交表單后，我使用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',

我遇到了同樣的問題。

我發現使用幾乎相同代碼的案例沒有提到此問題：例如， 如何使用從flask中的ajax發布的數據？

我的猜測是，我的url被解析為String對象而不是url，但是我無法弄清楚它為什么發生以及如何解決。

這是怎么回事？

Answer 1

您應該刪除對JSON.stringify的調用，可以在POST數據和JSON.stringify將您的對象變成[Object object]直接傳遞序列化的表單。

url: '/add_int',因為（看起來）您的前端在與后端不同的端口上運行而無法使用，因此它將被拒絕為“跨域”請求。 您是否檢查了"{{ url_for('add_int') }}"返回的值？

Answer 2

嘗試不明確指定哈希鍵。 http://api.jquery.com/jquery.post/

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