ajax 的登录认证

在models中先创建一个表

from django.db import models

# Create your models here.
class UserInfo(models.Model):
    username = models.CharField(max_length=32,unique=True)
    password = models.CharField(max_length=32,unique=True)

在setting的文件中的最后一行配置静态地址

STATICFILES_DIRS=[os.path.join(BASE_DIR,"static")]

在Python Console中用ORM创建一条测试用的用户名和密码, 也可以直接在数据库中添加

from app01.models import UserInfo
UserInfo.objects.create(username="wang",password="wang")

开始写html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/static/js/jquery-3.3.js"></script>
</head>
<body>
<form action="">
    用户名<input type="text" id="user">
    密码<input type="password" id="pwd">
    <input type="submit" value="提交" id="login_btn"><span class="error"></span>
    {% csrf_token %}
</form>

<script>
    $("#login_btn").click(function(){
        //发送Ajax请求登录认证
        $.ajax({
            url:"/login/",
            type:"post",
            data:{
                user:$("#user").val(),
                pwd:$("#pwd").val(),
                csrfmiddlewaretoken:$("[name='csrfmiddlewaretoken']").val()
            },
            success:function(res){
                var res=JSON.parse(res); //反序列化数据  把字符串转换成支持的类型
                console.log(res);

                if (res.user){
                    // 登录成功
                    location.href="/index/"
                }else{
                    //登录失败
                    $(".error").html(res.error).css("color","red");
                    setTimeout(function(){
                        $(".error").html("")
                    },2000)
                }

            }
        })
    })

</script>

</body>
</html>

views视图

from django.shortcuts import render,HttpResponse,redirect
from app01.models import UserInfo


# ajax的用户登录
def login(request):
    if request.method == "POST":
        user = request.POST.get("user")
        pwd = request.POST.get("pwd")

        res = {"user": None, "error": ""}
        user_obj = UserInfo.objects.filter(username=user,password=pwd).first()
        print("user_obj:",user_obj)

        if user_obj:
            res["user"]=user_obj.username
        else:
            res["error"]="用户名和密码不一致"
        return HttpResponse(json.dumps(res))
    return render(request,"login.html")

def index(request):
    return render(request,"index.html")