一、模板

组成

HTML代码

动态插入的代码(挖坑、填坑逻辑控制代码)

作用

快速生成HTML页面

优点

模板的设计实现了业务逻辑与现实内容的分离

视图可以使用任何模板

模板处理

加载

渲染

二、模板使用

变量

- 从视图函数中传递到模板

{{ var }}

{{ 变量 }}

变量不存在，则插入空的字符串

标签

逻辑处理

使用：

{% tag %}

- 标签if

{% if 条件 %}

代码区块

{% endif %}

{% if 条件 %}

代码区块1

{% else %}

代码区块2

{% endif %}

{% if 条件 %}

代码区块1

{% elseif %}

代码区块2

{% else %}

代码区块3

{% endif %}

标签for - in

{% for 变量 in 列表%}

代码区块

{% endfor %}

#循环的当前次数(从1开始)

{{ forloop.counter }}

#循环的当前次数(从0开始)

{{ forloop.counter0 }}

#循环的当前次数(逆序显示)

{{ forloop.revcounter }}

单行注释

{# 注释内容 #}

模板中的注释，如果HTML注释:\

多行注释

{% comment %}

注释区块

{% endcomment %}

标签 ifequal 和 finotequal

{{% ifequal 条件1 条件2%}}

代码区块

{{% endifequal %}}

{{% ifnotequal 条件1 条件2%}}

代码区块

{{% endifnotequal %}}

过滤器

{{ var|过滤条件}}

过滤条件：lower\upper\join:''\default:' '\...

标签include

加载模板(带参数渲染)

{% include '模板位置' with 参数1 参数2 参数3..... %}

exp：{% include 'index_context.html'%}

四、反向解析

基本语法

{% url 'namespace:name' p1 p2.....%}

name: url添加一个别名(不同应用中，可能会出现重名)

namespace:命名空间

五、模板继承

作用

提高页面的代码复用(提取共有部分，作为基类)

block标签

- 挖坑和填坑的过程

# 挖坑

{% block 标签名%}

{% endblock 标签名 %}

# 填坑

{% block 标签名%}

代码区块

{% endblock 标签名 %}

extends标签

{% extends 'home.html' %}

六、HTML转义

return render(request,'cart.html',content={'code':

购物车

})

#默认会转义：当前普通字符串

{{code}}

#方式一：过滤

{{ code|safe }}

#方式二：关闭自定义转义

{% autoescape off%}

{{ code }}

{% endautoescape %}

七、生成验证码

导包

# 安装pillow : pip install pillow

from PIL import Image, ImageDraw, ImageFont

实现代码

def verifycode(request):

bgcolor = (random.randint(0,255)),random.randint(0,255),random.randint(0,255)

width = 100

height = 50

#创建图片

image = Image.new('RGB',(width,height),bgcolor)

#创建画笔对象

draw = ImageDraw.Draw(image)

# 绘制噪点

for i in range(0,1000):

xy = (random.randrange(0,width),random.randrange(0,height))

fill = random.randrange(0,255),random.randrange(0,255),random.randrange(0,255)

draw.point(xy,fill=fill)

# 定义验证码的备选值

str = '1234567890QWERTYUIOPASDFGHJKLZXCVBNMqwertyuiopasdfghjklzxcvbnm'

# 随机选取四个值作为验证码

rand_str = ''

for i in range(0,4):

rand_str += str[random.randrange(0,len(str))]

#构建字体对象

font =ImageFont.truetype('static/fonts/Songti.ttc',40)

#构建字体颜色

fontcolor1 = (255, random.randrange(0, 255), random.randrange(0, 255))

fontcolor2 = (255, random.randrange(0, 255), random.randrange(0, 255))

fontcolor3 = (255, random.randrange(0, 255), random.randrange(0, 255))

fontcolor4 = (255, random.randrange(0, 255), random.randrange(0, 255))

#绘制四个字

draw.text((5,1),rand_str[0],font=font,fill=fontcolor1)

draw.text((25,1),rand_str[1],font=font,fill=fontcolor2)

draw.text((45,1),rand_str[2],font=font,fill=fontcolor3)

draw.text((75,1),rand_str[3],font=font,fill=fontcolor4)

# 释放画笔

del draw

# 存入session，用于验证

request.session['verify'] = rand_str

buff = io.BytesIO()

image.save(buff,'png')

return HttpResponse(buff.getvalue(),'image/png')

备注： code1 = request.session['verify'] 【登录获取图片上的验证码】 code2 = request.POST.get('verifycode') 【获取登录表单上输入的验证码】