Cách chuyển hướng với Flask và jQuery

Question

Tôi đang sử dụng Flask làm phụ trợ của tôi và jQuery cho một dự án cá nhân mà tôi đang làm việc.

Để đăng nhập Tôi muốn làm điều này:

$.ajax({ 
    type: "POST", 
    data: JSON.stringify(body), //username and password 
    contentType: 'application/json; charset=utf-8', 
    url: "/login", 
    success: successFunction, 
    error: errorFunction, 
    complete: completeFunction 
}); 

Trong errorFuction tôi sẽ nói cho người dùng biết tên đăng nhập hoặc mật khẩu của họ là không chính xác, vv

Trên backend đường/đăng nhập của tôi trông như thế này

@app.route("/login", methods=['GET', 'POST']) 
def login(): 
    if(request.method == "POST"): 
     #retrieve the username and password sent 
     data = request.json 

     if(data is None or not 'username' in data or not 'password' in data): 
      abort(400) 
     else: 
      count = User.query.filter(User.username == data['username']).count() 
      if(count == 0): 
       abort(404) #that user doesnt exist 
      else: 
       passIsCorrect = User.query.filter(User.username == data['username'], 
                User.password == data['password']).count() 
       if(passIsCorrect): 
        session['user'] = data['username'] 
        return redirect(url_for('index')) 
       else: 
        abort(401) 

    else: 
     return render_template('login.html') 

Tuy nhiên ở phía khách hàng, trình duyệt không chuyển hướng và nếu tôi nhìn vào đối tượng phản hồi trong hàm đầy đủ, tôi sẽ thấy những gì thường được trả về từ '/' route: 200 OK và mẫu index.html.

Câu hỏi của tôi là:

Có cách nào tôi có thể chặn làm cho khách hàng chuyển hướng không?

Tôi giả định vấn đề là vì jquery đang khởi tạo yêu cầu chứ không phải trình duyệt.

Lần đầu tiên tôi giải quyết vấn đề này là tự mình xây dựng phản hồi bằng cách sử dụng make_response và đặt tiêu đề Vị trí nhưng điều này dẫn đến hành vi tương tự. Giải pháp hiện tại của tôi là để trở về 200 và sau đó là khách hàng không window.location = "/", nhưng điều này dường như hacky

Answer 1

Chuyển hướng cuộc gọi ajax không làm việc, trình duyệt làm không tôn trọng họ. Hầu hết mọi người triển khai giải pháp chuyển hướng tùy chỉnh của riêng họ, bằng cách trả lại mã 200 và URL để chuyển hướng đến trong phản hồi JSON. Xem this question để biết một số ví dụ hay. Là một lưu ý phụ, việc đăng biểu mẫu đăng nhập qua ajax không thực sự mang lại cho bạn nhiều lợi thế, tôi sẽ để cho trình duyệt POST biểu mẫu bình thường và sau đó hàm Flask view của bạn chuyển hướng đến một trang mới thành công hoặc chuyển hướng trở lại đến trang đăng nhập thất bại, có thể với thông báo flash để thông báo cho người dùng về lỗi.

Answer 2

Không sử dụng lý do chuyển hướng với ajax vì nó sẽ trở lại nội dung chuyển hướng (trong trường hợp của bạn chỉ bằng lòng với index endpoint). Vì vậy, bạn có thể trở lại liên kết để chuyển hướng nếu tất cả ok (trạng thái 200) chuyển hướng thay vì thực:

return url_for('index') 

và xử lý nó với js của bạn:

var successFunction = function (data) { 
    // do something 
    window.location = data; 
};