注册 regist
注册采用的是form表单,提交到数据库,在登录的时候,查询数据,看用户是否注册,如果用户没有注册,则返回注册页面注册
(1)models.py文件里创建相关字段:用户姓名 密码 cookies携带的ticket
from django.db import models
# Create your models here.
class Users(models.Model):
u_name = models.CharField(max_length=10)
u_password = models.CharField(max_length=255)
u_ticket = models.CharField(max_length=20,null=True)
class Meta:
db_table = 'day51_user'
(2)urls.py配置相关路由
from django.contrib import admin
from django.urls import path
from zc.views import *
urlpatterns = [
path('admin/', admin.site.urls),
path('index', index, name='index'),
path('login', login, name='login'),
path('regist', regist, name='regist'),
path('logout', logout, name='logout'),
]
(3)views.py编写方法
导入相关的包,在regist,login,logout都会使用到
from django.shortcuts import render
import random
import time
from django.contrib import auth
from django.contrib.auth.hashers import make_password,check_password
from django.contrib.auth.models import User
from django.http import HttpResponseRedirect, HttpResponse
from django.urls import reverse
# Create your views here.
from zc.models import Users
书写regist方法
如果用户请求regist方法,则直接跳转到相关的HTML页面
如果用户在HTML页面点击的post按钮,对密码进行加密后,将提交到数据库,并返回登录login页面
def regist(request):
if request.method == 'GET':
return render(request, 'day6_regist.html')
if request.method == 'POST':
# 注册
name = request.POST.get('name')
password = request.POST.get('password')
#对密码进行加密
password = make_password(password)
Users.objects.create(u_name=name, u_password=password)
return HttpResponseRedirect('login')
前端
{% load static %}
<!DOCTYPE html>
<html>
<head>
<link type="text/css" href="/static/css/Loginstyle.css" rel="stylesheet" />
<link type="text/css" href="/static/css/register.css" rel="stylesheet" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>注册</title>
<div class="container"></div>
<script type="text/javascript" src="/static/js/jquery.js"></script>
<script type="text/javascript" src="/static/js/jparticle.min.js"></script>
<script type="text/javascript" src="/static/js/Login.js"></script>
<script type="text/javascript">
$(function(){
$(".container").jParticle({
background: "rgba(0,0,0,0)",//背景颜色
color: "#fff",//粒子和连线的颜色
particlesNumber:200,//粒子数量
//disableLinks:true,//禁止粒子间连线
//disableMouse:true,//禁止粒子间连线(鼠标)
particle: {
minSize: 1,//最小粒子
maxSize: 3,//最大粒子
speed: 30,//粒子的动画速度
}
});
});
</script>
</head>
<body>
<form action="" method="post">
{% csrf_token %}
<div id="div-Login"style="position:absolute;top:220px;left:725px;">
<input type="text"placeholder="请输入用户名"autofocus="autofocus"name="name"id="user"/>
<input type="password"placeholder="请输入密码"name="password"id="pwd"/>
<img src="/static/img/user.png" id="img-user" />
<img src="/static/img/password.png" id="img-pwd" />
{# <input type="reset" value="重置" id="btn-reset"/>#}
<input type="submit" value="注册" id="btn-register">
</div>
</form>
{# <button id="btn-back" οnclick="back()"style="position:absolute;top:520px;left:935px;">返回</button>#}
</body>
</html>
登录login方法
def login(request):
if request.method == 'GET':
return render(request, 'day6_login.html')
if request.method == 'POST':
# 如果登录成功,绑定参数到cookie中,set_cookie
name = request.POST.get('name')
password = request.POST.get('password')
# 查询用户是否在数据库中
if Users.objects.filter(u_name=name).exists():
user = Users.objects.get(u_name=name)
if check_password(password, user.u_password):
# ticket = 'agdoajbfjad'
ticket = ''
for i in range(15):
s = 'abcdefghijklmnopqrstuvwxyz'
# 获取随机的字符串
ticket += random.choice(s)
now_time = int(time.time())
ticket = 'TK' + ticket + str(now_time)
# 绑定令牌到cookie里面
# response = HttpResponse()
response = HttpResponseRedirect('/stu/index/')
#max_age 存活时间(秒)
response.set_cookie('ticket', ticket, max_age=10000)
# 存在服务端
user.u_ticket = ticket
user.save() #保存
return response
else:
# return HttpResponse('用户密码错误')
return render(request, 'day6_login.html', {'password': '用户密码错误'})
else:
# return HttpResponse('用户不存在')
return render(request, 'day6_login.html', {'name': '用户不存在'})
login(request):
if request.method == 'GET':
return render(request, 'day6_login.html')
if request.method == 'POST':
# 如果登录成功,绑定参数到cookie中,set_cookie
name = request.POST.get('name')
password = request.POST.get('password')
# 查询用户是否在数据库中
if Users.objects.filter(u_name=name).exists():
user = Users.objects.get(u_name=name)
if check_password(password, user.u_password):
# ticket = 'agdoajbfjad'
ticket = ''
for i in range(15):
s = 'abcdefghijklmnopqrstuvwxyz'
# 获取随机的字符串
ticket += random.choice(s)
now_time = int(time.time())
ticket = 'TK' + ticket + str(now_time)
# 绑定令牌到cookie里面
# response = HttpResponse()
response = HttpResponseRedirect('/stu/index/')
#max_age 存活时间(秒)
response.set_cookie('ticket', ticket, max_age=10000)
# 存在服务端
user.u_ticket = ticket
user.save() #保存
return response
else:
# return HttpResponse('用户密码错误')
return render(request, 'day6_login.html', {'password': '用户密码错误'})
else:
# return HttpResponse('用户不存在')
return render(request, 'day6_login.html', {'name': '用户不存在'})
前端
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>登录</title>
<link rel="stylesheet" href="/static/css/Login.css" />
<link type="text/css" href="/static/css/Loginstyle.css" rel="stylesheet" />
</head>
<body>
<div class="container"></div>
<style>
b
{
position: absolute;
left:228px;
top:302px;
font-family:'微软雅黑';
font-size:20px;
}
a
{
text-decoration: none;
font-family:'微软雅黑';
font-size:30px;
}
</style>
<script type="text/javascript" src="/static/js/jquery.js"></script>
<script type="text/javascript" src="/static/js/jparticle.min.js"></script>
<script type="text/javascript" src="/static/js/Login.js"></script>
<script type="text/javascript">
$(function(){
$(".container").jParticle({
background: "rgba(0,0,0,0)",//背景颜色
color: "#fff",//粒子和连线的颜色
particlesNumber:200,//粒子数量
disableLinks:true,//禁止粒子间连线
//disableMouse:true,//禁止粒子间连线(鼠标)
particle: {
minSize: 1,//最小粒子
maxSize: 3,//最大粒子
speed: 30,//粒子的动画速度
}
});
});
</script>
<form action="" method="post">
{% csrf_token %}
<div id="div-Login"style="position:absolute;top:230px;left:720px;">
<input type="text"placeholder="请输入用户名"autofocus="autofocus"name="name"id="user"/>
<input type="password"placeholder="请输入密码"name="password"id="pwd"/>
<img src="/static/img/user.png" id="img-user" />
<img src="/static/img/password.png" id="img-pwd" />
<input type="submit" value="登录" id="btn-login" />
{# <input type="reset" value="重置" id="btn-reset"/>#}
<input type="button" value="注册" id="btn-register"οnclick="register()">
</div>
</form>
</body>
</html>
主界面方法
def index(request):
if request.method == 'GET':
ticket = request.COOKIES.get('ticket')
if not ticket:
return HttpResponseRedirect('login')
if Users.objects.filter(u_ticket=ticket).exists():
return render(request, 'index.html', locals())
else:
return HttpResponseRedirect('login')
登出方法
def logout(request):
if request.method == 'GET':
response = HttpResponseRedirect('login')
response.delete_cookie('ticket')
return response
前端
登出是在主界面加一个退出按钮,点击退出按钮跳转到登录界面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>首页</title>
</head>
<body>4
hello world
<form action="" method="post">
{% csrf_token %}
<a href="logout"><input type="button" value="退出"></a>
</form>
</body>
</html>