溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

Django Admin用戶登錄(jquery處理方法)

發(fā)布時(shí)間:2020-04-02 11:22:56 來(lái)源:網(wǎng)絡(luò) 閱讀:1457 作者:sunday208 欄目:web開發(fā)

一、URL配置:

    # 用戶登陸列表
    # 用戶登陸
    url(r'login/',  views_study.study_login, name='study_login'),   #views.login, name='login'),
    url(r'^study/login/', views_study.study_login, name='study_login'),
    url(r'^study/username/', views_study.study_username, name='study_index'),
    # 用戶退出
    url(r'logout/', views.logout, name='logout'),
    # 密碼修改
    url(r'password_change/', views.password_change, name='password_change'),

二、前端網(wǎng)頁(yè)內(nèi)容:

<html lang="en">
<head>
    <meta charset="utf-8">
    <link rel="icon" href="/static/p_w_picpaths/favicon.ico">
    <title>運(yùn)維管理平臺(tái)登陸</title>
    <link href="/static/css/simple-line-icons.css" rel="stylesheet">
    <link href="/static/css/style.css" rel="stylesheet">
</head>
<body class="app flex-row align-items-center">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-md-5 card card-group card-block">
                <!--form class="center" method="post"> <!--建立一個(gè)用于登陸的form表單 %csrf_token%-->
                <h2 class="text-center">jq運(yùn)維管理平臺(tái)登陸</h2>
                <p class="text-muted text-center">請(qǐng)輸入你的帳號(hào)和密碼!</p>
                <div class="input-group mb-1">
                    <span class="input-group-addon"><i class="icon-user"></i>
                    </span>
                    <input id="username"  maxlength="254" type="text" class="form-control" placeholder="用戶名"/>
                </div>

                <div class="input-group mb-2">
                    <span class="input-group-addon"><i class="icon-lock"></i>
                    </span>
                    <input id="password"  type="password" class="form-control" placeholder="密碼" />
                </div>
                <button id="login"  type="submit" class="btn btn-primary px-2"><i class="icon-key"></i>登錄</button>
                <!--/form-->
            </div>
        </div>
    </div>
<script src="/static/js/libs/jquery.min.js"></script>
<script >
     $.ajaxSetup({
        data: {csrfmiddlewaretoken: '{{ csrf_token }}' },
        });
     function Login() {
        var username=$('#username').val();
        var password=$('#password').val();
        //var csrfmiddlewaretoken = $("input[name='csrfmiddlewaretoken']").val();

{#       調(diào)用ajax提交數(shù)據(jù) #}
        $.ajax({
            url:"/login/",
            data:{"username": username, "password": password},
            type:'POST',
            success:function(data){
                data=JSON.parse(data)
                if(!data.status){
                    alert(data.content);
                    return false;
                }
                else {
                    location.href="/study/username/"   //跳轉(zhuǎn)
                }
            }
        });
     }
    $(function() {
        document.getElementById("login").onclick = function () {
            Login();
        }
    })
</script>
</body>
</html>


三、后端網(wǎng)頁(yè)內(nèi)容:

def study_login(request):
    print ("study_login訪問(wèn)時(shí)間點(diǎn):%s" %datetime.now().strftime("%Y-%m-%d %H:%M:%S.%f"))
    if request.method == 'POST':
        username = request.POST.get('username')
        password = request.POST.get('password')
        user = authenticate(username=username, password=password)
        if user is not None:  # pass authtencation
            login(request, user)
            return HttpResponse(json.dumps({
                "status": 200,
            }))
        else:
            return HttpResponse(json.dumps({
                "content": "用戶名或者密碼不匹配,請(qǐng)檢查.....",
            }))
    else:
        return render(request, 'study/login_jquery.html')


四、效果圖:

Django Admin用戶登錄(jquery處理方法)

Django Admin用戶登錄(jquery處理方法)

Django Admin用戶登錄(jquery處理方法)


向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI