上传文件(缺Ajax版)

发布时间 2023-12-06 17:34:56作者: 木屐呀

内容回顾:

1.Ajax

 1 ##Ajax
 2     url:
 3     type:
 4     data: 
 5         1.value不能是字典:{k1:v1,k2:[1,2,3],k3:JSON.stringify({})} 
 6         2.$('').serialize()
 7     dataType:  'JSON'   #text,html,xml
 8     traditional:
 9     success:function (arg){
10         
11     }
12     error:function (){
13     
14     }

2.序列化

 1 ##序列化
 2     把一个对象保存在硬盘上 -->> 序列化
 3     JavaScript:
 4         JSON.parse()
 5         JSON.stringify()
 6     Django:
 7         json.dumps()
 8         json.loads()
 9         问题:只能对数据的基本类型处理,例如对QuerySet这种对象就不行了
10             serialize: models.TB.objects.all()
11             
12             json: list(models.TB.objects.values())
13             json: list(models.TB.objects.values_list())

3.Form

 1 作用:用于验证+生成HTML+保留上次提交数据+初始化页面数据
 2 使用:
 3     -1. 创建类
 4     -2. 创建字段
 5     -3. 验证用户输入:
 6         obj = Form(request.POST,request.FILES)
 7         if obj.is_valid():
 8             obj.cleaned_data
 9         else:
10         obj.errors
11     // 自定义扩展验证
12     -4. clean_字段  #单个字段
13     -5. clean() _post_clean() #整体
14     
15     ps:__all__ #整体错误信息

4.分页

1 Paginator Page类
2 a.内置
3 b.扩展
4 c.自定义

5.XSS攻击: 跨站脚本攻击

 1 防止攻击:
 2     -其他人输入的内容:不用safe   ->> 例如用户评论
 3     -自己输入的内容: 可用safe
 4 
 5 <script>
 6 for(var i=0;i<999;i++){
 7     alert(i)
 8 }
 9 </script>
10 
11 <script>
12     获取本地cookie,发送到另一个网站
13 </script>

文件上传:

#正常形式文件上传

 1 from django.shortcuts import render,HttpResponse
 2 import os,uuid
 3 # Create your views here.
 4 
 5 #正常方式文件上传
 6 def N_upload(request):
 7     if request.method == "GET":
 8         return render(request,"N_upload.html")
 9     elif request.method == "POST":
10         nid = str(uuid.uuid4())
11         name = request.POST.get('user')
12         pwd = request.POST.get('pwd')
13         img = request.FILES.get('img')
14         print(name)
15         print(pwd)
16         print(img.name)
17         print(img.size)
18         file_path = os.path.join('static',nid+img.name)
19         f = open(file_path,'wb')
20         for line in img.chunks():
21             f.write(line)
22         f.close()
23         return HttpResponse('upload success')
 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8     <form action="/N_upload.html/" method="post" enctype="multipart/form-data">
 9         <input type="text" name="user">
10         <input type="password" name="pwd">
11         <input type="file" name="img">
12         <input type="submit" value="提交">
13     </form>
14 </body>
15 </html>

#制作精美的上传按钮

1 #制作精美的上传文件按钮
2 def B_upload(request):
3     if request.method == "GET":
4         return render(request,"B_upload.html")
5     elif request.method =="POST":
6         return HttpResponse('精美的上传按钮')
 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8     <form action="/B_upload.html/" method="post" enctype="multipart/form-data">
 9         <input type="text" name="user">
10         <input type="password" name="pwd">
11         <div style="position: relative;">
12             <a>上传</a>
13             <input type="file" name="img" style="opacity: 0;position: absolute;top: 0;left: 0;">    // 重点在a标签和input标签部分重合,且input标签看不见
14         </div>
15         <input type="submit" value="提交">
16     </form>
17 </body>
18 </html>

#Form组件上传文件

 1 from django import forms
 2 from django.forms import fields
 3 from django.forms import widgets
 4 
 5 class UploadForm(forms.Form):
 6     user = fields.CharField()
 7     pwd = fields.CharField()
 8     img = fields.FileField()
 9 
10 #Form组件上传文件
11 def F_upload(request):
12     if request.method == "GET":
13         obj = UploadForm()
14         return render(request,"F_upload.html",{'obj':obj})
15     elif request.method == "POST":
16         obj = UploadForm(request.POST,request.FILES)
17         if obj.is_valid():
18             print(obj.cleaned_data)
19             user = obj.cleaned_data['user']
20             pwd = obj.cleaned_data['pwd']
21             img = obj.cleaned_data['img']
22             print(user)
23             print(pwd)
24             # img是对象(文件大小,文件名称,文件内容)
25             print(img.name)
26             print(img.size)
27             nid = str(uuid.uuid4())
28             file_path = os.path.join('static',nid+img.name)
29             f = open(file_path,'wb')
30             for line in img.chunks():
31                 f.write(line)
32             f.close()
33             return HttpResponse('upload success')
34         else:
35             print(obj.errors)
36             return HttpResponse('upload failed')
 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8     <form action="/F_upload.html/" method="post" enctype="multipart/form-data">
 9         <p>{{ obj.user }}</p>
10         <p>{{ obj.pwd }}</p>
11         <p>{{ obj.img }}</p>
12         <input type="submit" value="提交">
13     </form>
14 </body>
15 </html>

ps  =========  Ajax上传文件并显示在前端上的功能 ,敬请期待Ajax专题