如何重定向与瓶和jQuery [英] How to redirect with Flask and jQuery

问题描述

我用瓶作为我的后端和jQuery的个人项目我的工作。

I'm using Flask as my backend and jQuery for a personal project I'm working on.

要登录我要做到这一点：

To login I want to do this:

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

在errorFuction我会告诉他们的用户名或密码不正确等用户。

In the errorFuction I would tell the user that their username or password is incorrect etc.

在后台我/登录路径看起来像这样

On the backend my /login route looks like this

@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')

但是在客户端，浏览器不会重定向，如果我期待在响应对象中的完整功能，我看什么通常会从我的'/'路线返回：200 OK和index.html的模板。

However on the client side, the browser doesn't redirect and if I look in the response object in the complete function I see what would normally be return from my '/' route: 200 OK and the index.html template.

我的问题是：

有没有一些方法，我可以拦截使客户端重定向？

Is there some way I can intercept make the client redirect?

我认为这个问题是因为jQuery是发出请​​求，而不是浏览器。

I assume the issue is because jquery is initiating the request and not the browser.

在解决这个问题我第一次尝试构建自己使用 make_response 的响应，并设置了Location头，但是这导致相同的行为。我目前的解决方案是返回200，然后在客户端执行了window.location =/，但这似乎哈克

My first attempt at solving this problem was to construct the response myself using make_response and set the Location header but this resulted in the same behaviour. My current solution is to return 200 and then the client does window.location = "/", but this seems hacky

推荐答案

在重定向ajax调用不工作，浏览器不尊敬他们。大多数人实现自己的自定义重定向的解决方案，通过返回code 200和一个URL重定向到JSON响应。请参阅<一href="http://stackoverflow.com/questions/199099/how-to-manage-a-redirect-request-after-a-jquery-ajax-call">this问题获得一些很好的例子。

Redirects on ajax calls don't work, browsers do not honor them. Most people implement their own custom redirect solution, by returning code 200 and a URL to redirect to in the JSON response. See this question for some good examples.

作为一个侧面说明，通过AJAX张贴登录表单并没有真正给你多大的优势，我先给浏览器POST方式正常，那么你的瓶视图功能重定向到一个新的页面上的成功或重定向回在失败的登录页面，可能与闪存信息通知用户出现错误。

As a side note, POSTing the login form via ajax does not really give you much of an advantage, I would let the browser POST the form normally and then your Flask view function redirects to a new page on success or redirects back to the login page on failure, possibly with a flash message to inform the user of the error.

这篇关于如何重定向与瓶和jQuery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！