スクラッチからジャンゴ（F）（2）

、Ajaxのログイン検証

　　Ajaxの実装を使用してログイン認証は、効果は次のとおりです。エラーを表示したときに他のページに失敗し、成功したジャンプ。

　　プロセスは次のように：①、htmlページ、パスワードでユーザー名を入力し、ユーザー名、パスワードフィールドを解決するために、対応するビューでPOSTを介してサーバに送信し、ログイン、サーバ機能]をクリックします。マッチが成功した場合、ORMデータベースのデータを照合することによって、ユーザ情報が返され、失敗したエラーメッセージが返されます。PythonとJSの間で異なるタイプのデータので、JSONのデータ伝送に使用し、AJAXのHTMLのJSに返される情報によって解決されます。JSでのPythonの辞書オブジェクト。

　　htmlコード：

<！DOCTYPE HTML > 
< HTML LANG = "EN" > 
< 頭> 
    < メタ文字コード= "UTF-8" > 
    < タイトル>アヤックス</ タイトル> 
    < スクリプトSRC = "/静的/ jqueryの/ jqueryの- 3.4.1.js" > </ スクリプト> 
</ ヘッド> 
< 身体> 
< H2 >ログイン-アヤックス</ H2 > 
< フォーム> 
    用户名<ID = "ユーザー" > 
    密码< 入力タイプ= "パスワード" ID = "PWD" > 
    < 入力タイプ= "ボタン" 値= "ログイン" クラス= "login_btn" > < スパンクラス= "エラー" > </ スパン> 
</ フォーム> 
< スクリプト> 
    $（" .login_btn " ）.click（関数（）{ 
       $アヤックス（{ 
           URL："/ test_ajax / " 、
           タイプ：" ポスト" 、
           データ：{ 
               " ユーザ" ：$（" #USER " ）.val（）、
                " PWD " ：$（" #pwd " ）.val（）
           }、
           成功：関数（データ）{ 
               コンソール。 （データ）ログ
               $（" #ret " ）.val（データ）
                VaRのデータ= JSON.parse（データ）
               はconsole.log（データ）
               であれば（data.user）{ 
                   場所。HREF =" http://baidu.com " 
               } 
               他{ 
                   $（' .ERROR ' ）の.html（data.msg）
               } 
           } 
       }）
    }）
</ スクリプト> 
</ ボディ> 
</ HTML >

機能コードは、ビュー：

デフtest_ajax（リクエスト）：
    ユーザー = request.POST.get（' ユーザ' ）
    PWD = request.POST.get（' PWD ' ）
    ユーザー = User.objects.filter（名=ユーザ、= PWD 1次回PWD）（）
    RES = { " ユーザ"：なし、' MSG ' ：なし}
     もしユーザー：
        RES [ " ユーザ" ] = user.name
     他：
        RES [ " MSG " ] = "ユーザー名かパスワードが間違っています「
    インポートのJSON
     リターンのHttpResponse（json.dumps（RES））

II。

スクラッチからジャンゴ（F）（2）

おすすめ