1. Data table structure design
The project application account model MyUser is the core data in the project, and it has a data relationship with each project application model. The model MyUser inherits the built-in model User, and adds new fields based on the built-in model User to improve user information. Open the models.py of the project application account to define the model MyUser, the code is as follows:
class MyUser(AbstractUser):
name = models.CharField(verbose_name="姓名",max_length=50,default='匿名用户')
introduce = models.TextField(verbose_name='简介',default="暂无介绍")
company = models.CharField(verbose_name="公司",max_length=100,default='暂无信息')
profession = models.CharField(verbose_name='职业',max_length=100,default='暂无信息')
address = models.CharField(verbose_name='地址', max_length=100, default='暂无信息')
telephone = models.CharField(verbose_name='电话', max_length=11, default='暂无信息')
wx = models.CharField(verbose_name='微信', max_length=50, default='暂无信息')
qq = models.CharField(verbose_name='qq',max_length=50,default='暂无信息')
wb = models.CharField(verbose_name='微博', max_length=100, default='暂无信息')
photo = models.ImageField(verbose_name='头像', blank=True,upload_to='images/user/')
create_time = models.DateTimeField(verbose_name='创建时间', auto_now_add=True)
class Meta:
verbose_name = '用户'
verbose_name_plural = verbose_name
db_table = 'MyUser'
def __str__(self):
return self.name
2. Routing definition
Using the routing delivery method, we set the account routing under Myblog's urls.py
# Myblog的 urls.py
urlpatterns = [
path('admin/', admin.site.urls),
path('user/', include('app.account.urls')),
]
# account的 urls.py
urlpatterns = [
path('register', Register.as_view(), name="register"),
path('login', UserLogin.as_view(), name="userLogin"),
]
3. Write the view class
We create a forms.py in the account to create the UserForm class for form authentication:
from django import forms
from django.forms import Form
from app.account.models import MyUser
from captcha.fields import CaptchaField
class UserForm(Form):
username = forms.CharField(
widget=forms.TextInput
)
password = forms.CharField(
widget=forms.PasswordInput
)
cp = forms.CharField(
widget=forms.PasswordInput,
required=False
)
type = forms.CharField(
widget=forms.TextInput
)
captcha = CaptchaField()
def clean(self):
username = self.cleaned_data.get("username", '')
if self.cleaned_data.get("type", '') == 'register':
if not username:
raise forms.ValidationError("用户名不能为空")
else:
user = MyUser.objects.filter(username=username).exists()
if user:
raise forms.ValidationError("用户名已存在")
p = self.cleaned_data.get("password", '')
cp = self.cleaned_data.get("cp", '')
if p != cp:
raise forms.ValidationError("两次密码不一致")
else:
d = {
'username': username,
'password': p,
'is_superuser': 1,
'is_staff': 1
}
user = MyUser.objects.create_user(**d)# create_user自动将明文密码hash加密
user.save()
else:
if not username:
raise forms.ValidationError("用户名不能为空")
Add the following code in view.py of account
from django.shortcuts import render, redirect, reverse
from django.views.generic import View
from .forms import *
from django.contrib.auth import authenticate, login
from captcha.models import CaptchaStore
from captcha.helpers import captcha_image_url
class Register(View):
info = {
'title': '注册博客',
'pageTitle': '用户注册',
"confirmPassword": True,
'button': '注册',
"urlText": '用户登录',
"submitUrl": 'register',
"urlName": 'userLogin',
"tips": '',
'form': '',
}
def get(self, request):
self.info['form'] = UserForm()
return render(request, 'user.html', self.info)
def post(self, request):
user_from = UserForm(request.POST)
if user_from.is_valid():
self.info["tips"] = '注册成功，请登录'
return redirect(reverse("register"), self.info)
else:
self.info["tips"] = user_from.errors.as_data().values()
return render(request, 'user.html', self.info)
class UserLogin(View):
info = {
'title': '登录博客',
'pageTitle': '用户登录',
'button': '登录',
'urlText': '用户注册',
'urlName': 'register',
'submitUrl': 'userLogin',
'tips': '',
'form': '',
'new_key': '',
'image_url': ''
}
def get(self, request):
self.info['new_key'] = CaptchaStore.pick() # 生成hashkey
self.info['image_url'] = captcha_image_url(self.info['new_key']) # 生成验证码图片url地址
self.info['form'] = UserForm()
return render(request, 'user.html', self.info)
def post(self, request):
user_from = UserForm(request.POST)
# 表单验证
if user_from.is_valid():
username = user_from.cleaned_data.get("username", '')
password = user_from.cleaned_data.get("password", '')
if not username or not password:
self.info['tips'] = "用户名或密码不能为空"
return render(request, 'user.html', self.info)
else:
if MyUser.objects.filter(username=username).exists():
user = authenticate(username=username, password=password)
if user:
if user.is_active:
'''
'''
login(request, user)
return redirect(reverse("index"), self.info)
else:
self.info['tips'] = '密码错误'
return render(request, 'user.html', self.info)
else:
self.info['tips'] = '用戶不存在'
return render(request, 'user.html', self.info)
else:
self.info["tips"] = user_from.errors.as_data().values()
return render(request, 'user.html', locals())
4. Jinja2 template engine
Replace the template engine that comes with django, use the jinja2 template engine, set jinja2 in the TEMPLATES configuration in the setting of Myblog, create jinja2.py with Myblog and add the jinja2 environment
# Myblog的setting中
TEMPLATES = [
{
'BACKEND': 'django.template.backends.jinja2.Jinja2',
'DIRS': [os.path.join(BASE_DIR, 'templates')]
,
'APP_DIRS': True,
'OPTIONS': {
'environment': 'Myblog.jinja2.environment',
},
},
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [os.path.join(BASE_DIR, 'templates')]
,
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
# jinja2.py
from django.contrib.staticfiles.storage import staticfiles_storage
from django.urls import reverse
from jinja2 import Environment
# 将jinja2 模板设置到项目环境中
def environment(**options):
env = Environment(**options)
env.globals.update({
'static': staticfiles_storage.url,
'url': reverse,
})
return env
5. Template writing
The jinja2 template engine is written, which is similar to the template usage that comes with django
<!DOCTYPE html>
<html lang="en">
<head>
<title>{
{ title }}</title>
<link rel="stylesheet" href="{
{static('css/reset.css')}}">
<link rel="stylesheet" href="{
{static('css/user.css')}}">
<script src="{
{static('js/jquery.min.js')}}"></script>
<script src="{
{static('js/user.js')}}"></script>
</head>
<body>
<div class="page">
<div class="loginwarrp">
<div class="logo">{
{ pageTitle }}</div>
<div class="login_form">
<form name="Login" method="post" action="{
{ url(submitUrl) }}">
{# 解决跨越访问#}
<input type="hidden" name="csrfmiddlewaretoken" value="{
{ csrf_token }}">
<input type="hidden" name="type" value="{
{ submitUrl }}">
<li class="login-item">
<span>用户名：</span>
<input type="text" name="username" class="login_input" >
<span id="count-msg" class="error"></span>
</li>
<li class="login-item">
<span>密 码：</span>
<input type="password" name="password" class="login_input">
<span id="password-msg" class="error"></span>
</li>
{% if confirmPassword %}
<li class="login-item">
<span>确认密码：</span>
<input type="password" name="cp" class="login_input">
<span id="password-msg" class="error"></span>
</li>
{% endif %}
<li class="login-item">
<span>验证码：</span>
<input type="text" class='login_input' id="id_captcha_1" name="captcha_1" placeholder='验证码' placeholder-data="验证码" />
<input type="hidden" id="id_captcha_0" name="captcha_0" value="{
{ new_key }}"> <img src="{
{ image_url }}" alt="captcha" class="captcha"> <br>
<span id="password-msg" class="error"></span>
</li>
<div>{
{ tips }}</div>
<li class="login-sub">
<input type="submit" name="Submit" value="{
{ button }}">
<div class="turn-url">
<a style="color: #45B572;" href="{
{ url(urlName) }}">>>{
{ urlText }}</a>
</div>
</li>
</form>
</div>
</div>
</div>
<script type="text/javascript">
window.onload = function() {
var config = {
vx : 4,
vy : 4,
height : 2,
width : 2,
count : 100,
color : "121, 162, 185",
stroke : "100, 200, 180",
dist : 6000,
e_dist : 20000,
max_conn : 10
}
CanvasParticle(config);
}
</script>
<script>
//点击验证码刷新
$(function () {
$('.captcha').click(function () {
console.log("click");
$.getJSON("/captcha/refresh", function (result) {
$(".captcha").attr('src', result['image_url']);
$('#id_captcha_0').val(result['key'])
});});
});
</script>
<script src="{
{ static('js/canvas-particle.js') }}"></script>
</body>
</html>
6. Verification code
Seven, renderings
