Django Python2.7 编写在线教育平台笔记第二部分(配置前端页面+后台代码编写)
前端页面地址 https://github.com/Lxstrive/DjangoHtml
1 . index页面设计
将index.html页面拷贝到Templates目录下
在项目目录中新建static目录 将css 、js、 image文件夹拷贝到static目录
在urls中配置index.html页面路径:
这里使用django中用来处理静态文件的TemplateView类会自动创建View视图只用调用TemplateView.as_view函数即可返回前端页面
from django.views.generic import TemplateView urlpatterns = [ url(r'^admin/', admin.site.urls), url(r'^xadmin/', xadmin.site.urls), url(r'^$', TemplateView.as_view(template_name='index.html'), name='index') ]
启动Django项目 在浏览器中输入127.0.0.1: 8000 这时的页面找不到CSS JS 文件
需要在Settgings.py文件中配置static目录的路径
STATICFILES_DIRS = [ os.path.join(BASE_DIR, 'static') ]
并且修改index.html中css js image的link路径 修改成/static/(可以用pycharm的全局替换)
页面可以正常显示
2.login.html 配置 在urls中写入 并且修改login页面中css js image路径 同上
url(r'^login/$', TemplateView.as_view(template_name='login.html'), name='login')
配置在index页面中点击登录跳转到login页面需要修改index.html中登录的跳转url
1.在urls中配置登录页面
2.编写usersAPP下视图函数
# -*- coding:utf-8 -*- __author__ = '_X.xx_' __date__ = '2018/6/8 14:08' from django.shortcuts import render from django.contrib.auth import authenticate, login def user_login(request): """ 用户登录方法 """ if request.method == 'POST': user_name = request.POST.get('username', '') pass_word = request.POST.get('password', '') # authenticate方法只进行验证 user = authenticate(username=user_name, password=pass_word) if user is not None: # login方法实现登录 login(request, user) return render(request, 'index.html', {}) else: return render(request, 'login.html', {}) elif request.method == 'GET': return render(request, 'login.html', {})
3.在index.html前端页面进行判断跳转显示 如果登录成功则显示用户名 否则显示登录注册
usersAPP视图函数中编写类 继承ModelBackend
from django.contrib.auth.backends import ModelBackend from django.db.models import Q from .models import UserProfile class CustomBackend(ModelBackend): """ 自定义登录类型 用户名和邮箱都可以登录 """ def authenticate(self, username=None, password=None, **kwargs): try: # 使用并级需要使用django.db.models 下的Q对象 user = UserProfile.objects.get( Q(username=username) | Q(email=username)) # 由于密码是密文传输,用户传进来的是明文 所以需要使用Django自带的user的 # check_password方法进行密码比对 if user.check_password(password): return user except Exception as e: return None
在settings.py中配置自定义登录的类:(注意的是一个元组类型),配置完成后 用户可以使用用户名或邮箱进行登录
优化一下登录功能,如果用户输入错误 给出提示
很简单只需要在登录方法中返回一个msg字典错误提示,在前端login页面接收信息即可
配置urls 这里的as_view()需要加括号
from users.views import LoginView
url(r'^login/$', LoginView.as_view(), name='login')在view视图中编写:
导入 from django.views.generic.base import View
class LoginView(View): """ 基础类的登录方法 """ def get(self, request): # 重写View的get方法 return render(request, 'login.html', {}) def post(self, request): user_name = request.POST.get('username', '') pass_word = request.POST.get('password', '') # authenticate方法只进行验证 user = authenticate(username=user_name, password=pass_word) if user is not None: # login方法实现登录 login(request, user) return render(request, 'index.html', {}) else: return render(request, 'login.html', {'msg': '用户名或密码错误'})
继续优化登录功能
在从数据库读取数据验证之前可以先使用django的forms进行先验证 可以减少数据库负载
1 .在usersAPP中新建forms.py文件 编写:
# !/usr/bin/env python # -*- coding:utf-8 -*- __author__ = '_X.xx_' __date__ = '2018/6/8 15:56' from django import forms class LoginForm(forms.Form): username = forms.CharField(required=True) password = forms.CharField(required=True, min_length=6)2.在view视图函数中post方法中引入forms
def post(self, request): # 实例化LoginForm传值request.POST(是字典形式)会先传入forms进行验证 login_form = LoginForm(request.POST) # is_valid()方法会先进行判断用户名密码 如果errors为空则进行下一步 if login_form.is_valid(): user_name = request.POST.get('username', '') pass_word = request.POST.get('password', '') # authenticate方法只进行验证 user = authenticate(username=user_name, password=pass_word) if user is not None: # login方法实现登录 login(request, user) return render(request, 'index.html', {}) else: return render(request, 'login.html', { 'msg': '用户名或密码错误', }) else: return render(request, 'login.html', { 'login_form': login_form, })
编写前端页面 将forms.erros传入前端页面
<div class="error btns login-form-tips" id="jsLoginTips">{% for key, error in login_form.errors.items %}{{ error }}{% endfor %}{{ msg }}div>
url(r'^forget/$', ForgetPwdView.as_view(), name='forget_pwd'),在forms里编写:
class ForgetForm(forms.Form): # 对email进行验证 email = forms.EmailField(required=True) captcha = CaptchaField(error_messages={'invalid': u'验证码错误'})配置前端页面css js 路径正常显示前端页面 form表单注意添加
{% csrf_token %}
class ForgetPwdView(View): """ 找回密码 """ def get(self, request): forget_form = ForgetForm() return render(request, 'forgetpwd.html', { 'forget_form': forget_form }) def post(self, request): forget_form = ForgetForm(request.POST) if forget_form.is_valid(): email = request.POST.get('email', '') send_register_email(email, 'forget') return render(request, 'send_success.html') else: return render(request, 'forgetpwd.html', { 'forget_form': forget_form })