8

我正在尝试使用 ajax 提交登录表单。我对应该如何处理异常/成功响应感到困惑。我从服务器收到 200 OK 并且表单通过密码/用户名字段返回错误。如何根据服务器响应显示错误消息或将用户重定向到适当的页面？

查询：

56 $(window).load(function(){                                                                                                                  
57 $('#login_form').submit(function(e){                                                                                                        
58             e.preventDefault();                                                                                                             
59     var request_url = document.getElementById('next').value                                                                             
60          $.ajax({                                                                                                                           
61             type:"POST",                                                                                                                    
62             url: $(this).attr('action'),                                                                                                    
63             data: $('#login_form').serialize(),                                                                                             
64             success: function(response){ $('#msg').text(response);                                                                          
65             console.log(response);                                                                                                          
66             },                                                                                                                              
67             error: function(xhr, ajaxOptions, thrownError){ alert( $('#login_error').text('Username already taken. Please select another one.')}, 
68           });                                                                                                                               
69     });                                                                                                                                     
70 });

查看：已更新

51 def login(request):                                                                                                                         
52     if request.method == 'POST':                                                                                                            
53         request.session.set_test_cookie()                                                                                                   
54         login_form = AuthenticationForm(request, request.POST)                                                                              
55         if login_form.is_valid():                                                                                                           
56             if request.is_ajax:                                                                                                             
57                 user = django_login(request, login_form.get_user())                                                                         
58                 if user is not None:                                                                                                        
59                     return HttpResponseRedirect(request.REQUEST.get('next', '/'))
           **else:**                                                                                                                               
61                **return HttpResponseForbidden() # catch invalid ajax and all non ajax**                                        
60     else:                                                                                                                                   
61         login_form = AuthenticationForm(request)                                                                                            
62                                                                                                                                             
63     c = Context({                                                                                                                           
64         'next': request.REQUEST.get('next'),                                                                                                
65         'login_form': login_form,                                                                                                           
66         'request':request,                                                                                                                  
67     })                                                                                                                                      
68     return render_to_response('login.html', c, context_instance=RequestContext(request))

形式：

7   <tt id="login_error"></tt>                                                                                                                            
8   <form id="login_form" action="" method="post">                                                                                            
9                                                                                                                                             
10     {{ login_form }}                                                                                                                        
11     <input type="submit" value="login"/>                                                                                                    
12     <input type="hidden" id="request_path" name="next" value="/"/>                                                                          
13   </form>                                                                                                                                   
14 <p>{{ request.get_full_path }}</p>                                                                                                          
15 <tt id='msg'></tt>
4

2 回答 2

8

尽管使用 json 执行此操作肯定是更好的做法，但假设您并没有真正从服务器传回太多信息，您也可以不用。在 django 方面HttpResponseRedirect，HttpResponse使用重定向 URL 作为您的消息交换。还为ajax登录失败的情况添加一个HttpResponseForbidden。

def login(request):                                                                                                                         
    if request.method == 'POST':                                                                                                            
        request.session.set_test_cookie()                                                                                                   
        login_form = AuthenticationForm(request, request.POST)                                                                              
        if login_form.is_valid():                                                                                                           
            if request.is_ajax:                                                                                                             
                user = django_login(request, login_form.get_user())                                                                         
                if user is not None:                                                                                                        
                    return HttpResponse(request.REQUEST.get('next', '/'))   
        return HttpResponseForbidden() # catch invalid ajax and all non ajax                                                        
    else:                                                                                                                                   
        login_form = AuthenticationForm()                                                                                                                                        
    c = Context({                                                                                                                           
        'next': request.REQUEST.get('next'),                                                                                                
        'login_form': login_form,                                                                                                                         
        'request':request,                                                                                                                  
    })                                                                                                                                      
    return render_to_response('login.html', c, context_instance=RequestContext(request))

然后在 javascript 端，检查响应的状态码。如果是 200，那么这就是你的HttpResponse- 你想重定向到响应消息中的 url。如果是 403，那么这就是您的 HttpResponseForbidden - 登录失败。您可以摆脱标准的“登录失败”错误消息。

$.ajax({                                                                                                                           
    type:"POST",                                                                                                                    
    url: $(this).attr('action'),                                                                                                    
    data: $('#login_form').serialize(),  
    // the success function is called in the case of an http 200 response                                                                                  
    success: function(response){ 
        // redirect to the required url
        window.location = response;                                                                                                     
     },                                                                                                                              
    error: function(xhr, ajaxOptions, thrownError){
        alert('login failed - please try again'); 
    }, 
});

恐怕我还没有测试过这个，但它应该给你一个想法。

有关更多信息，请查看django 的 HttpResponse objects 的文档。然后查看jquery ajax 文档。

于 2012-12-09T06:39:59.750 回答
1 
return HttpResponseRedirect(request.REQUEST.get('next', '/'))

如果您正在执行 ajax ，您显然不能使用它，客户端必须负责重定向/显示/在 Ajax 响应中发回的任何内容。如果登录成功，发送一个 JSON 响应告诉客户端重定向自己（使用 javascript 重定向），如果不是，发送一个带有错误列表的 JSON 响应并使用 javascript 显示它们。

于 2012-12-09T04:07:32.107 回答