zl程序教程

您现在的位置是:首页 >  .Net

当前栏目

012:Django高级请求

2023-03-15 22:04:45 时间

本章知识点

1、图片上传 2、Ajax post请求

知识点讲解

1、图片上传

1、在form表单的标签当中添加属性 enctype=“multipart/form-data”

2、input的name一定要看好

在视图当中 1、接收图片不是request.POST或者request.GET 是request.FILES

2、校验的时候,我们可以把request.post 和request.FILES一起传入校验

3、post数据正常保存 但是文件对象,在数据库保存是地址(img的name)

4、保存图片 settings

views

文件可以保存

2、Ajax post请求 Ajax的get请求,然后,我们学校ajax的post Ajax的post 构建formdata对象 formdata等于一个表单数据容器。可以把所有表单元素的name与value组成一个queryString,提交到后台。 在使用ajax提交时,使用FormData对象可以减少拼接queryString的工作量

1、开始往formdata当中添加数据 键值对 1、文件对象的处理

2、csrf_token 键:csrfmiddlewaretoken 值:{{ csrf_token }} 画红线的地方

然后发起ajax请求

URL:“”暂时为空

定义后端请求处理的函数

def ajaxPostData(request): “”" 处理数据页面 “”" result = {“statue”:“error”,“data”:""} if request.method == “POST” and request.POST: postData = request.POST #post的数据 postFile = request.FILES #提交的文件 img_file = postFile.get(“photo”) student_valid = StudentForm(data = postData,files = postFile) if student_valid: nickname = postData.get(“nickname”) age = postData.get(“age”) gender = postData.get(“gender”) phone = postData.get(“phone”) email = postData.get(“email”) address = postData.get(“address”) classes = postData.get(“classes”) project = Project.objects.get(id=int(postData.get(“project”))) score = postData.get(“score”) photo = img_file.name s = Student() s.nickname = nickname s.age = age s.gender = gender s.phone = phone s.email = email s.address = address s.classes = classes s.project = project s.score = score s.photo = “img/”+photo path = os.path.join(MEDIA_ROOT,“img\%s”%photo) with open(path,“wb”) as f: for i in img_file.chunks(): f.write(i) s.save() result[“statue”] = “success” result[“data”] = “%s is saved”%nickname else: result[“data”] = student_valid.errors #表单校验的错误信息 else: result[“data”] = “your request method must be post” return JsonResponse(result)

指定路由,ajax发起请求

代码测试

ajax发起请求。添加了URLS。 $.ajax( { url: “/student/ajaxPostData/”, type: “POST”, data: formData, processData: false, //是否严格检查数据格式 contentType: false, //是否严格检查内容类型 success: function (data) { console.log(data) //接收返回数据 }, error: function (error) { console.log(error) //接收返回错误 } } ) 本章总结 图片上传 Ajax post请求