django模板 Django的CSRF django核心配置settings 模板 作为Web框架，Django提供了模板，用于编写html代码，还可以嵌入模板代码更快更方便的完成页面开发，再通过在视图中渲染模板，将生成最终的html字符串返回给客户端浏览器。模版致力于表达外观，而不是程序逻辑。模板的设计实现了业务逻辑view与显示内容template的分离，一个视图可以使用任意一个模板，一个模板可以供多个视图使用。 模板包含两部分： 静态部分，包含html、css、js。 动态部分，就是模板语言。 Django模板语言，简写DTL，定义在django.template包中。 创建项目后，在"项目名称/settings.py"文件中定义了关于模板的配置。 TEMPLATES = [ { 'BACKEND': 'django.template.backends.django.DjangoTemplates', 'DIRS': [os.path.join(BASE_DIR,'tamplates')], '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', ], }, }, ] DIRS定义一个目录列表，模板引擎按列表顺序搜索这些目录以查找模板文件，通常是在项目的根目录下创建templates目录。 Django处理模板分为两个阶段： 加载：根据给定的路径找到模板文件，编译后放在内存中。 渲染：使用上下文数据对模板插值并返回生成的字符串。 为了减少开发人员重复编写加载、渲染的代码，Django提供了简写函数render，用于调用模板。 1、创建示例项目 1）创建项目demo4。 2）进入项目目录demo4，创建应用app1。 3）在demo4/settings.py中INSTALLED_APPS项注册应用。 4）在demo4/settings.py中DATABASES项配置使用MySQL数据库demo3，数据库在昨天已经创建。 5）在demo4/__init__.py中，导入pymysql，并且调用install_as_MySQLdb()方法 6）在demo4/settings.py中TEMPLATES项配置模板查找路径。 7）创建模板目录。 8）打开demo4/urls.py文件，包含app1的url配置。 9）在app1目录下创建urls.py，配置url。 from django.conf.urls import url from .views import * urlpatterns=[ url(r'^$',index), ] 10）打开views.py文件，定义视图index。 from django.shortcuts import render def index(request): return render(request,'app1/index.html') 11）在templates/app1目录下创建文件index.html，代码如下： <html> <head> <title>首页</title> </head> <body> </body> </html> 12）打开app1/models.py文件，定义模型类NewsInfo，结构参照第二部分设计。 from django.db import models class NewsInfo(models.Model): news_title = models.CharField(max_length=20) news_content = models.TextField() news_date = models.DateField() isDelete = models.BooleanField(default=False) 13）生成迁移、执行迁移 14）设置管理界面本地化、打开demo4/settings.py文件，找到语言编码、时区的设置项，将内容改为如下： LANGUAGE_CODE = 'zh-hans' #使用中国语言 TIME_ZONE = 'Asia/Shanghai' #使用中国上海时间 15、创建admin管理员，命令如下 python manage.py createsuperuser 16、admin.py中注册模型类， from .models import * admin.site.register(NewsInfo) 16、启动服务器，登录admin后台， 17、添加几条初始数据 2、模板语言 模板语言包括4种类型，分别是： 变量 标签 过滤器 注释 接下来逐个介绍4种类型。 2.1、模板变量 模板变量的作用是计算并输出，变量名必须由字母、数字、下划线（不能以下划线开头）和点组成。 语法如下： {{变量}} 当模版引擎遇到点如dict.title，会按照下列顺序解析： 字典dict['title'] 先属性后方法，将dict当作对象，查找属性title，如果没有再查找方法title() 如果是格式为dict.0则解析为列表dic[0] 如果变量不存在则插入空字符串''。 在模板中调用方法时不能传递参数。 示例 1）打开views.py文件，创建视图temp。 def temp(request): a = 'aaaa' b = {'b1':'b1111','b2':'b2222'} c = [1,2,3] news = NewsInfo() news.title = 'new的属性' return render(request,'app1/temp.html',locals()) 2）打开booktest/urls.py文件，配置url。 url(r'^temp/$', views.temp), 3）修改在templates/app1下创建temp.html。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>temp</title> </head> <body> <h2> a变量：{{a}}<br> 字典属性值b.b1：{{b.b1}},<br> 列表对象的下标c.0的值：{{c.0}}<br> 对象news的tltle属性：{{news.title}}<br> </h2> </body> </html> 4）运行服务器，在浏览器中输入如下网址。 http://127.0.0.1:8000/temp 5）浏览效果如下图。 2.1、模板标签 语法如下： {%代码段%} for标签语法如下： {%for item in 列表%} 循环逻辑 {{forloop.counter}}表示当前是第几次循环，从1开始 {%empty%} 列表为空或不存在时执行此逻辑 {%endfor%} if标签语法如下： {%if ...%} 逻辑1 {%elif ...%} 逻辑2 {%else%} 逻辑3 {%endif%} 比较运算符如下： 注意：运算符左右两侧不能紧挨变量或常量，必须有空格。 == != < > <= >= 布尔运算符如下： and or not 示例:for的使用 1）打开views.py文件，创建视图temp2。 from .models import NewsInfo def temp2(request): news_list = NewsInfo.object.all() return render(request,'app1/temp2.html',locals()) 2）打开app1/urls.py文件，配置url。 url(r'^temp2$',temp2), 3）在templates/app1下创建temp2.html。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>标签</title> </head> <body> <h1>新闻列表如下：</h1> <ul> {%for new in news_list%} <h2><li>{{new.news_title}}</li></h2> {%endfor%} </ul> </body> </html> 4）运行服务器，在浏览器中输入如下网址。 http://127.0.0.1:8000/temp2/ 浏览效果如下图： 示例:if的使用 1) 更改temp2.html代码，如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>标签</title> </head> <body> <h1>新闻列表如下：</h1> <ul> {%for new in new_list%} {%if new.id < 2%} <h2><li style="background: red">{{new.news_title}}</li></h2> {%elif new.id < 4%} <h2><li style="background: gold">{{new.news_title}}</li></h2> {%else%} <h2><li style="background: grey">{{new.news_title}}</li></h2> {%endif%} {%empty%} <h2 style="color: red">没有获取到数据</h2> {%endfor%} </ul> </body> </html> 2）刷新浏览器，效果如下 2.3、过滤器 语法如下: 使用管道符号|来应用过滤器，用于进行计算、转换操作，可以使用在变量、标签中。 如果过滤器需要参数，则使用冒号:传递参数。 语法：{ { 变量|过滤器 }}，例如{ { name|lower }}，表示将变量name的值变为小写输出 变量|过滤器:参数 使用管道符号 (|)来应用过滤器 通过使用过滤器来改变变量的计算结果 可以在if标签中使用过滤器结合运算符 if list1|length > 1 过滤器能够被“串联”，构成过滤器链 name|lower|upper 过滤器可以传递参数，参数使用引号包起来 list|join:", " default：如果一个变量没有被提供，或者值为false或空，则使用默认值，否则使用变量的值 value|default:"什么也没有" 日期date，用于对日期类型的值进行字符串格式化，常用的格式化字符如下： value|date:'Y-m-d' Y表示年，格式为4位，y表示两位的年。 m表示月，格式为01,02,12等。 d表示日, 格式为01,02等。 j表示日，格式为1,2等。 H表示时，24进制，h表示12进制的时。 i表示分，为0-59。 s表示秒，为0-59。 点击查看详细的过滤器 示例 1）打开app1/views.py文件，创建视图temp3。 def temp3(request): #模板过滤器 new_list = NewsInfo.objects.all() return render(request,'app1/temp3.html',locals()) 2）打开app1/urls.py文件，配置url。 url(r'^temp3/$', temp3), 3）在templates/booktest下创建temp_filter.html。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>过滤器</title> </head> <body> <h1>新闻数量为:{{new_list|length}}</h1> //通过过滤器获取新闻总数 {%for new in new_list%} {%if new.id > 3%} <h2><li style="color: red"> {{new.news_title}} ---原来的日期格式:{{new.news_date}}</li></h2> {%else%} <h2><li style="color: gold"> {{new.news_title}} ---过滤器格式化的日期： {{new.news_date|date:"y-m-j"}}</li></h2> {%endif%} {%endfor%} </body> </html> 4）运行服务器，在浏览器中输入如下网址。 http://127.0.0.1:8000/temp3 浏览效果如下图： 2.4、注释 在模板中使用如下模板注释，这段代码不会被编译，不会输出到客户端；html注释只能注释html内容，不能注释模板语言。 1）单行注释语法如下： {#...#} 注释可以包含任何模版代码，有效的或者无效的都可以。 {# { % if foo % }bar{ % else % } #} 2）多行注释使用comment标签，语法如下： {%comment%} ... {%endcomment%} 3、模板继承 模板继承和类的继承含义是一样的，主要是为了提高代码重用，减轻开发人员的工作量。 典型应用：网站的头部、尾部信息。 3.1、父模板 如果发现在多个模板中某些内容相同，那就应该把这段内容定义到父模板中。 标签block：用于在父模板中预留区域，留给子模板填充差异性的内容，名字不能相同。 为了更好的可读性，建议给endblock标签写上名字，这个名字与对应的block名字相同。父模板中也可以使用上下文中传递过来的数据。 {%block 名称%} 预留区域，可以编写默认内容，也可以没有默认内容 {%endblock 名称%} 3.2、子模板 标签extends：继承，写在子模板文件的第一行。 {% extends "父模板路径"%} 子模版不用填充父模版中的所有预留区域，如果子模版没有填充，则使用父模版定义的默认值。 填充父模板中指定名称的预留区域。 {%block 名称%} 实际填充内容 {{block.super}}用于获取父模板中block的内容 {%endblock 名称%} 示例 1）打开app1/views.py文件，创建视图temp4。 def temp4(request): #模板过滤器 title = '模板继承' new_list = NewsInfo.objects.all() return render(request,'app1/temp3.html',locals()) 2）打开app1/urls.py文件，配置url。 url(r'^temp4$',temp4), 3）在templates下创建inherit_base.html。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>{{title}}</title> </head> <body> <h1>-------------------网页头部-------------------</h1> <hr> {% block quyu1%} <p>这个是区域1,请添加内容</p> {%endblock quyu1%} <hr> {%block quyu2%} <p>这个是区域2,请添加内容</p> {%endblock quyu2%} <hr> <h1>-------------------网页尾部---------------------</h1> </body> </html> 4）在templates/app1下创建temp4。 {% extends 'base.html'%} <!--继承bash.html页面--> {% block quyu2%} <!--添加预留区域的内容-->--> {%for new in new_list%} <h3><li>{{new.news_title}}</li></h3> {%endfor%} {%endblock quyu2%} 5）运行服务器，在浏览器中输入如下网址。 http://127.0.0.1:8000/temp4 6）浏览效果如下图。 4、HTML转义 模板对上下文传递的字符串进行输出时，会对以下字符自动转义。 小于号< 转换为 < 大于号> 转换为 > 单引号' 转换为 ' 双引号" 转换为 " 与符号& 转换为 & 示例 1）打开app1/views.py文件，创建视图html_escape。 #模板过滤器 content = '<h1>新闻列表</h1>' return render(request,'app1/temp_html.html',locals()) 2）打开app1/urls.py文件，配置url。 url(r'^temp_html$',temp_html), 3）在templates/app1/目录下创建temp_html.html。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HTML转义</title> </head> <body> content：{{content}} </body> </html> 4）运行服务器，在浏览器中输入如下网址。 http://127.0.0.1:8000/temp_html 转义后标记代码不会被直接解释执行，而是被直接呈现，防止客户端通过嵌入js代码攻击网站. 浏览效果如下图: 4.1、关闭转义 过滤器escape可以实现对变量的html转义，默认模板就会转义，一般省略。 {{content|escape}} 过滤器safe ：禁用转义，告诉模板这个变量是安全的，可以解释执行。 {{content|safe}} 1）修改templates/app1/temp_html.html代码如下。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HTML转义</title> </head> <body> content：{{content}} <hr> 过滤器safe关闭转义content：{{content|safe}} </body> </html> 刷新浏览器后效果如下图： 标签autoescape ：设置一段代码都禁用转义，接受on、off参数。 {%autoescape off%} ... {%endautoescape%} 1）修改templates/booktest/html_escape.html代码如下。 <html> <head> <title>转义</title> </head> <body> 自动转义：{{content}} <hr> 过滤器safe关闭转义：{{content|safe}} <hr> 标签autoescape关闭转义： {%autoescape off%} {{content}} {%endautoescape%} </body> </html> 刷新浏览器后效果如下图： 4.2、字符串字面值 对于在模板中硬编码的html字符串，不会转义。 1）修改templates/app1/temp.html代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HTML转义</title> </head> <body> content：{{content}} <hr> 过滤器safe关闭转义content：{{content|safe}} <hr> {%autoescape off%} 标签autoescape关闭转义：{{content}} {%endautoescape%} <hr> 模板硬编码：{{data|default:"<h2>新闻1</h2>"}} </body> </html> 2）刷新浏览器后效果如下图： 如果希望出现转义的效果，则需要手动编码转义。 1）修改templates/app1/temp.html代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HTML转义</title> </head> <body> content：{{content}} <hr> 过滤器safe关闭转义content：{{content|safe}} <hr> {%autoescape off%} 标签autoescape关闭转义：{{content}} {%endautoescape%} <hr> 模板硬编码不转义：{{data|default:"<h2>新闻1</h2>"}} <hr> 模板硬编码手动转义：{{data|default:"<h2>新闻2</h2>"}} </body> </html> 2）刷新浏览器后效果如下图： 5、CSRF CSRF全拼为Cross Site Request Forgery，译为跨站请求伪造。CSRF指攻击者盗用了你的身份，以你的名义发送恶意请求。CSRF能够做的事情包括：以你名义发送邮件，发消息，盗取你的账号，甚至于购买商品，虚拟货币转账......造成的问题包括：个人隐私泄露以及财产安全。 5.1. csrf攻击 示例 攻击过程的操作了解即可，不需要重现。 首先做一个登录页，让用户输入用户名和密码进行登录，登录成功之后跳转的修改密码页面。在修改密码页面输入新密码，点击确认按钮完成密码修改。 登录页需要一个模板文件login.html.修改密码页面也需要一个模板文件change_pwd.html. 显示登录页的视图login，验证登录的视图login_check，显示发帖页的视图change_pwd,处理修改密码的视图change_pwd_action. 加功能： a)只有用户登录之后才可以进行修改密码操作。 案例流程图： 5.2django防止csrf的方式： 1) 默认打开csrf中间件。 2) 表单post提交数据时加上{% csrf_token %}标签。 防御原理: 1) 渲染模板文件时在页面生成一个名字叫做csrfmiddlewaretoken的隐藏域。 2) 服务器交给浏览器保存一个名字为csrftoken的cookie信息。 3) 提交表单时，两个值都会发给服务器，服务器进行比对，如果一样，则csrf验证通过，否则失败。 当启用中间件并加入标签csrf_token后，会向客户端浏览器中写入一条Cookie信息，这条信息的值与隐藏域input元素的value属性是一致的，提交到服务器后会先由csrf中间件进行验证，如果对比失败则返回403页面，而不会进行后续的处理。 6、反向解析 先看看原来怎么做 1) 打开app1/views.py文件，创建视图reverse1、reverse2。 def reverse1(request): content = '这个是页面reverse1' return render(request,'app1/reverse1.html',locals()) def reverse2(request): content = '这个是页面reverse2' return render(request,'app1/reverse2.html',locals()) 2）打开app1/urls.py文件，配置url。 url(r'^reverse1$',reverse1), url(r'^reverse2$',reverse2), 3）在templates/app1/目录下创建reverse1.html和reverse2.html reverse1.html 代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>页面1</title> </head> <body> <h1>{{content}}</h1> <h3><a href="/reverse2">reverse2页面链接</a></h3> </body> </html> reverse2.html 代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>页面1</title> </head> <body> <h1>{{content}}</h1> </body> </html> 4）运行服务器，在浏览器中输入如下网址： http://127.0.0.1:8000/reverse1 浏览效果如下图： 5）点击链接后转向了reverse2，效果如下图： 6）打开app1/urls.py文件，修改"reverse2"的正则表达式为"rever2"。 url(r'^reve2$',reverse2), 7）打开浏览器，后退一下，刷新后再次点击链接，浏览如下图： 问题就来了：随着功能的增加会出现更多的视图，可能之前配置的正则表达式不够准确，于是就要修改正则表达式，但是正则表达式一旦修改了，之前所有对应的超链接都要修改，真是一件麻烦的事情，而且可能还会漏掉一些超链接忘记修改，有办法让链接根据正则表达式动态生成吗？ 答： 反向解析 。 反向解析应用在两个地方：模板中的超链接，视图中的重定向。 反向解析实现 要实现反向解析功能，需要如下步骤： 1）在demo4/urls.py中为include定义namespace属性。 url(r'^',include('app1.urls',namespace='app1')) 2）在app1/urls.py中为url定义name属性，并修改为reverse2 url(r'^reverse2$',reverse2,name='reverse2'), 3）在模板中使用url标签做超链接，此处为templates/app1/reverse2.html文件。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>页面1</title> </head> <body> <h1>{{content}}</h1> <h3><a href="/reverse2">reverse2页面链接</a></h3> <h3><a href="{%url 'app1:reverse2'%}">reverse2页面反向链接</a></h3> </body> </html> 4）回到浏览器中，后退，刷新，查看源码如下图，两个链接地址一样。 5）在app1/urls.py中，将reverse2修改为rev2。 url(r'^rev2$',reverse2,name='reverse2'), 6）回到浏览器中，刷新，查看源文件如下图，两个链接地址不一样。 7）反向解析也可以应用在视图的重定向中。 创建视图函数 re3 from django.shortcuts import redirect from django.core.urlresolvers import reverse def re3(request): return redirect(reverse('app1:reverse2')) 配置ur def re3(request): return redirect(reverse('app1:reverse2')) 访问页面re3,被重定向到reverse3页面 总结：在定义url时，需要为include定义namespace属性，为url定义name属性，使用时，在模板中使用url标签，在视图中使用reverse函数，根据正则表达式动态生成地址，减轻后期维护成本。 7、验证码案列、 验证码 在用户注册、登录页面，为了防止暴力请求，可以加入验证码功能，如果验证码错误，则不需要继续处理，可以减轻业务服务器、数据库服务器的压力。 8.1、手动实现验证码 接下来的代码不要求手动写出来，因为这种代码在网上可以搜到很多。 1）安装包Pillow3.4.1。 pip install Pillow==3.4.1 点击查看PIL模块API，以下代码中用到了Image、ImageDraw、ImageFont对象及方法。 2）在app1/views.py文件中，创建视图verify_code。 提示1：随机生成字符串后存入session中，用于后续判断。 提示2：视图返回mime-type为image/png。 from PIL import Image, ImageDraw, ImageFont from django.utils.six import BytesIO ... def verify_code(request): #引入随机函数模块 import random #定义变量，用于画面的背景色、宽、高 bgcolor = (random.randrange(20, 100), random.randrange( 20, 100), 255) width = 100 height = 25 #创建画面对象 im = Image.new('RGB', (width, height), bgcolor) #创建画笔对象 draw = ImageDraw.Draw(im) #调用画笔的point()函数绘制噪点 for i in range(0, 100): xy = (random.randrange(0, width), random.randrange(0, height)) fill = (random.randrange(0, 255), 255, random.randrange(0, 255)) draw.point(xy, fill=fill) #定义验证码的备选值 str1 = 'ABCD123EFGHIJK456LMNOPQRS789TUVWXYZ0' #随机选取4个值作为验证码 rand_str = '' for i in range(0, 4): rand_str += str1[random.randrange(0, len(str1))] #构造字体对象，ubuntu的字体路径为“/usr/share/fonts/truetype/freefont” font = ImageFont.truetype('FreeMono.ttf', 23) #构造字体颜色 fontcolor = (255, random.randrange(0, 255), random.randrange(0, 255)) #绘制4个字 draw.text((0, 2), rand_str[0], font=font, fill=fontcolor) draw.text((25, 2), rand_str[1], font=font, fill=fontcolor) draw.text((50, 2), rand_str[2], font=font, fill=fontcolor) draw.text((75, 2), rand_str[3], font=font, fill=fontcolor) #释放画笔 del draw #存入session，用于做进一步验证 request.session['verifycode'] = rand_str #内存文件操作 buf = BytesIO() #将图片保存在内存中，文件类型为png im.save(buf, 'png') #将内存中的图片数据返回给客户端，MIME类型为图片png return HttpResponse(buf.getvalue(), 'image/png') 3）打开booktest/urls.py文件，配置url。 url(r'^verify_code/$', views.verify_code), 4）运行服务器，在浏览器中输入如下网址。 http://127.0.0.1:8000/verify_code/ 5）浏览效果如下图： 可以多刷新几次看值会不会变。 8.2、调用验证码 1）在booktest/views.py文件中，创建视图verify_show。 def verify_show(request): return render(request,'booktest/verify_show.html') 2）打开booktest/urls.py文件，配置url。 url(r'^verify_show/$', views.verify_show), 3）在templates/booktest/目录下创建verify_show.html。 <html> <head> <title>验证码</title> </head> <body> <form method="post" action="/verify_yz/"> {%csrf_token%} <input type="text" name="yzm"> <img id="yzm" src="/verify_code/"/> <span id="change">看不清，换一个</span> <br> <input type="submit" value="提交"> </form> </body> </html> 4）运行服务器，在浏览器中输入如下网址。 http://127.0.0.1:8000/verify_show/ 5）浏览效果如下图： 验证 1）在booktest/views.py文件中，创建视图verify_yz。 def verify_yz(request): yzm=request.POST.get('yzm') verifycode=request.session['verifycode'] response=HttpResponse('no') if yzm==verifycode: response=HttpResponse('ok') return response 2）打开booktest/urls.py文件，配置url。 url(r'^verify_yz/$', views.verify_yz), 3）回到浏览器后刷新，在文本框中填写验证码，点击提交按钮。 Django的CSRF django核心配置settings
