今日内容概要
-
前后端数据传输的编码格式
-
Ajax提交json格式的数据
-
Ajax提交文件数据
-
Ajax实现弹窗的二次确认
-
批量增加数据
-
分页的原理及推导
-
分页类的使用
-
cookie和session的介绍
-
Django操作cookie、session
前后端数据传输的编码格式
我们只研究post请求方式的编码格式
"""
get请求方式没有编码格式
index?useranme=&password=
参数直接在url地址的后面拼接着
get请求方式没有请求体
"""
有哪些方式可以提交post请求
form表单
Ajax
api工具
研究form表单的post请求
默认的编码格式：urlencoded
数据传输的形式：title=dasdas&price=2312&date=&publish=2&authors=3
对于Django后端是如何接收数据的：
把提交过来的数据都封装到了request.POST中
还可以提交form-data格式的
enctype:form-data # 提交文件数据
数据传输的形式：
title=dasdas&price=2312&date=&publish=2&authors=3
--------------binary-----------------------------
文件数据
# 对于Django后端如何接收数据的
普通数据还是在request.POST中
文件数据呢还是在request.FILES中
"""之所以你能够在POST和FILES中接收数据，是因为Django给你封装了，提交过来的数据并不是queryDICT"""
# ajax提交post请求
默认情况下，Ajax提交的数据后端还是在request.POST中接收的
默认的编码格式：urlencoded
需要修改contentType类型：json格式的
"""对于符合urlencoded格式的数据后端都是在request.POST中接收数据的"""
Ajax提交json格式的数据
前后端传输数据的时候一定要保证编码格式数据与真正的数据格式是一致的
引入
后端
def ab_json(request):if request.method == 'POST':print(request.POST) #<QueryDict: {}>return render(request, 'ab_json.html')
前端
<button class="btn btn-danger" id="d1">点我</button><script>$('#d1').click(function () {$.ajax({url: '',type: 'post',// 前端数据转JSON格式数据 ：JSON.stringifydata: JSON.stringify({"username": "dream", "password": 521521}),// 不指定参数，默认就是 urlencodedcontentType: 'application/json',success: function (args) {}})})
</script>
请求标头携带的数据格式
已成功转换为JSON格式
{"username":"dream","password":521521}
后端
接收到的数据为空
def ab_json(request):if request.method == 'POST':print(request.POST) #<QueryDict: {}>return render(request, 'ab_json.html')
Django针对JSON格式的数据不会做任何的处理
针对JSON格式的数据需要自己手动处理
解决办法
def ab_json(request):print(request.is_ajax()) # Trueif request.method == 'POST':print(request.POST) # <QueryDict: {}>print(request.body) # 返回的是二进制数据 ：b'{"username":"dream","password":521521}'# 针对JSON格式的数据需要自己手动处理json_bytes = request.body# （1）方式一：先解码 再转换数据格式json_str = json_bytes.decode('utf-8')json_dict = json.loads(json_str)print(json_dict, type(json_dict)) # {'username': 'dream', 'password': 521521} <class 'dict'># （2）方式二：json.loads(二进制数据) 内部可以自动解码再反序列化json_dict_loads = json.loads(json_bytes)print(json_dict_loads, type(json_dict_loads)) # {'username': 'dream', 'password': 521521} <class 'dict'>return render(request, 'ab_json.html')
reques方法判断Ajax
request.is_ajax()
返回当前请求是否是Ajax请求，返回布尔值
print(request.is_ajax()) 正常浏览器网址回车提交的是 GET 请求 - 结果是False 当我们发送ajax请求后 - 结果是True
总结
前端在通过Ajax请求发送数据的时候，一定要注参数修改
// 不指定参数，默认就是 urlencoded
contentType: 'application/json',
数据是真正的JSON格式数据
发送的数据一定要符合JSON格式或经过JSON序列化再传输
Django后端不会帮我们处理JSON格式数据，需要自己手动处理request.body中的数据
通过Ajax传过来的数据是二进制数据
在reques.body中，要经过自己的反序列化才能拿到我们想要的数据
Ajax发送文件数据
Ajax发送文件数据需要借助js内置对象formdata
前端
<p>username: <input type="text" name="username" id="d1"></p>
<p>password: <input type="password" name="password" id="d2"></p>
<p>file: <input type="file" id="d3"></p><button id="btn" class="btn btn-danger">提交</button><script>// 点击按钮向后端发送普通键值对数据和文件数据$("#btn").on('click', function () {// （1）先生成一个内置对象let formDataObj = new FormData();// （2）支持添加普通的键值对formDataObj.append('username', $("#d1").val());formDataObj.append('password', $("#d2").val());// （3）支持添加文件对象 ---> 先拿到标签对象 ----> 再拿到文件对象formDataObj.append('myfile', $("#d3")[0].files[0]);// （4）基于Ajax，将文件对象发送给后端$.ajax({url: '',type: 'post',// 直接将对象放到data里面即可data: formDataObj,// Ajax发送文件必须添加的两个参数// 不需要使用任何编码 - Django后端能自动识别 formdata 对象contentType: false,// 告诉浏览器不要对我的数据进行任何处理processData: false,success: function (args) {}})})
</script>
后端
def ab_file(request):if request.is_ajax():if request.method == 'POST':print('POST::>>', request.POST)# 普通键值对放在了 request.POST 中# POST::>> <QueryDict: {'username': ['dream'], 'password': ['666']}>print('FILES::>>', request.FILES)# 文件数据放在了 request.FILES 中# FILES::>> <MultiValueDict: {'myfile': [<InMemoryUploadedFile: img.png (image/png)>]}>return render(request, 'ab_file.html')
发送文件数据格式
// 点击按钮向后端发送普通键值对数据和文件数据
$("#btn").on('click', function () {
// （1）先生成一个内置对象
let formDataObj = new FormData();// （2）支持添加普通的键值对
formDataObj.append('username', $("#d1").val());
formDataObj.append('password', $("#d2").val());// （3）支持添加文件对象 ---> 先拿到标签对象 ----> 再拿到文件对象
formDataObj.append('myfile', $("#d3")[0].files[0]);// （4）基于Ajax，将文件对象发送给后端
$.ajax({
url: '',
type: 'post',
// 直接将对象放到data里面即可
data: formDataObj,// Ajax发送文件必须添加的两个参数
// 不需要使用任何编码 - Django后端能自动识别 formdata 对象
contentType: false,
// 告诉浏览器不要对我的数据进行任何处理
processData: false,success: function (args) {}
})
结论
Ajax发送文件数据需要利用内置对象FormData
// （1）先生成一个内置对象
let formDataObj = new FormData();// （2）支持添加普通的键值对
formDataObj.append('username', $("#d1").val());
formDataObj.append('password', $("#d2").val());// （3）支持添加文件对象 ---> 先拿到标签对象 ----> 再拿到文件对象
formDataObj.append('myfile', $("#d3")[0].files[0]);
需要指定两个关键性的参数
// Ajax发送文件必须添加的两个参数
// 不需要使用任何编码 - Django后端能自动识别 formdata 对象
contentType: false,
// 告诉浏览器不要对我的数据进行任何处理
processData: false,
Django后端能直接自动识别FormData对象
将内部的普通键值对自动解析并封装到request.POST中
将内部的文件自动解析并封装到request.FILES中
print('POST::>>', request.POST)
# 普通键值对放在了 request.POST 中
# POST::>> <QueryDict: {'username': ['dream'], 'password': ['666']}>print('FILES::>>', request.FILES)
# 文件数据放在了 request.FILES 中
# FILES::>> <MultiValueDict: {'myfile': [<InMemoryUploadedFile: img.png (image/png)>]}>
批量插入数据
bulk_list = []for i in range(10000):user_obj=models.UserInfo(username='kevin%s' %i)bulk_list.append(user_obj)# 循环之后得到了一个列表，10000个对象# 数据库的优化， 同样的功能，不同的sql执行的效率差距很大# 优化查询速度的时候，首先想到的是，加索引、优化sql语句，有的sql走做引、有的sql不走索引models.UserInfo.objects.bulk_create(bulk_list)分页原理及推导
分页推导
首先我们需要明确的时候，get请求也是可以携带参数的，所以我们在朝后端发送查看数据的同时可以携带一个参数告诉后端我们想看第几页的数据
其次我们还需要知道一个点，queryset对象是支持索引取值和切片操作的，但是不支持负数索引情况
接下来我们就可以推导我们的自定义分页器步骤了
current_page = request.GET.get("page",1) # 获取用户想访问的页码 如果没有 默认展示第一页
try: # 由于后端接受到的前端数据是字符串类型所以我们这里做类型转换处理加异常捕获current_page = int(current_page)
except Exception as e:current_page = 1
# 还需要定义页面到底展示几条数据
per_page_num = 10 # 一页展示10条数据# 需要对总数据进行切片操作 需要确定切片起始位置和终止位置
start_page = ?
end_page = ?
"""
下面需要研究current_page、per_page_num、start_page、end_page四个参数之间的数据关系
per_page_num = 10
current_page start_page end_page1 0 102 10 203 20 30 4 30 40per_page_num = 5
current_page start_page end_page1 0 52 5 103 10 15 4 15 20
可以很明显的看出规律
start_page = (current_page - 1) * per_page_num
end_page = current_page* per_page_num
"""数据总页面获取
问题1:总数据有100条，每页展示10条，总共需要几页？
答案:10条
问题2:总数据有101条，每页展示10条，总共需要几页?
答案:11条
问题3:如何通过代码算出到底需要多少条？
答案:去你妹的，不会！！！
内置方法之divmod
>>> divmod(100,10)
(10, 0) # 10页
>>> divmod(101,10)
(10, 1) # 11页
>>> divmod(99,10)
(9, 9) # 10页
# 余数只要不是0就需要在第一个数字上加一我们可以判断元组的第二个数字是否为0从而确定需要多少页来展示数据
book_queryset = models.Book.objects.all()
all_count = book_queryset.count() # 数据总条数
all_pager, more = divmod(all_count, per_page_num)
if more: # 有余数则总页数加一all_pager += 1至此分页器大致的功能及思路我们就已经大致清楚了
最后我们只需要利用start_page和end_page对总数据进行切片取值再传入前端页面就能够分页展示
book_list = models.Book.objects.all()[start_page:end_page]
return render(request,'booklist.html',locals())接下来就是前端页面的代码编写了
{% for book in book_list %}<p>{{ book.title }}</p>
{% endfor %}现在我们实现了最简单的分页，但是前端没有按钮去让用户点击需要看第几页，所以我们需要渲染分页器相关代码，这里我们不做要求直接去bootstrap框架拷贝代码即可
终极大法
上面是自定义分页器开发流程的基本思路，我们不需要掌握代码的编写，只需要掌握基本用法即可
自定义分页器封装代码
class Pagination(object):def __init__(self, current_page, all_count, per_page_num=2, pager_count=11):"""封装分页相关数据:param current_page: 当前页:param all_count: 数据库中的数据总条数:param per_page_num: 每页显示的数据条数:param pager_count: 最多显示的页码个数"""try:current_page = int(current_page)except Exception as e:current_page = 1if current_page < 1:current_page = 1self.current_page = current_pageself.all_count = all_countself.per_page_num = per_page_num# 总页码all_pager, tmp = divmod(all_count, per_page_num)if tmp:all_pager += 1self.all_pager = all_pagerself.pager_count = pager_countself.pager_count_half = int((pager_count - 1) / 2)@propertydef start(self):return (self.current_page - 1) * self.per_page_num@propertydef end(self):return self.current_page * self.per_page_numdef page_html(self):# 如果总页码 < 11个：if self.all_pager <= self.pager_count:pager_start = 1pager_end = self.all_pager + 1# 总页码 > 11else:# 当前页如果<=页面上最多显示11/2个页码if self.current_page <= self.pager_count_half:pager_start = 1pager_end = self.pager_count + 1# 当前页大于5else:# 页码翻到最后if (self.current_page + self.pager_count_half) > self.all_pager:pager_end = self.all_pager + 1pager_start = self.all_pager - self.pager_count + 1else:pager_start = self.current_page - self.pager_count_halfpager_end = self.current_page + self.pager_count_half + 1page_html_list = []# 添加前面的nav和ul标签page_html_list.append('''<nav aria-label='Page navigation>'<ul class='pagination'>''')first_page = '<li><a href="?page=%s">首页</a></li>' % (1)page_html_list.append(first_page)if self.current_page <= 1:prev_page = '<li class="disabled"><a href="#">上一页</a></li>'else:prev_page = '<li><a href="?page=%s">上一页</a></li>' % (self.current_page - 1,)page_html_list.append(prev_page)for i in range(pager_start, pager_end):if i == self.current_page:temp = '<li class="active"><a href="?page=%s">%s</a></li>' % (i, i,)else:temp = '<li><a href="?page=%s">%s</a></li>' % (i, i,)page_html_list.append(temp)if self.current_page >= self.all_pager:next_page = '<li class="disabled"><a href="#">下一页</a></li>'else:next_page = '<li><a href="?page=%s">下一页</a></li>' % (self.current_page + 1,)page_html_list.append(next_page)last_page = '<li><a href="?page=%s">尾页</a></li>' % (self.all_pager,)page_html_list.append(last_page)# 尾部添加标签page_html_list.append('''</nav></ul>''')return ''.join(page_html_list)自定义分页器的使用
后端
def get_book(request):book_list = models.Book.objects.all()current_page = request.GET.get("page",1)all_count = book_list.count()page_obj = Pagination(current_page=current_page,all_count=all_count,per_page_num=10)page_queryset = book_list[page_obj.start:page_obj.end]return render(request,'booklist.html',locals())前端
<div class="container"><div class="row"><div class="col-md-8 col-md-offset-2">{% for book in page_queryset %}<p>{{ book.title }}</p>{% endfor %}{{ page_obj.page_html|safe }}</div></div>
</div>
：扩展数据类型之 别名 详解)
