8

ajaxを使用してログインフォームを送信しようとしています。例外/成功した応答をどのように処理することになっているのか混乱しています。サーバーから200OKを取得していますが、フォームはパスワード/ユーザー名フィールドのいずれかでエラーを返します。サーバーの応答に応じて、ユーザーを適切なページに表示またはリダイレクトするためのエラーメッセージを取得するにはどうすればよいですか？

JQUERY：

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側では、リダイレクトURLをメッセージとして使用するHttpResponseRedirectためにを交換します。また、ajaxログインが失敗した場合HttpResponseのを追加します。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オブジェクトのドキュメントをご覧ください。次に、jqueryajaxのドキュメントを確認してください。

于 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 に答える