在生成input标签的时候可以指定input标签的类型为file类型

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h4>{{ error_message }}</h4>
<form action="/index/" method="post">
{% csrf_token %}
<p><input type="file" name="up_file"></p>
<input type="submit">
</form>
</body>
</html>

此时,在网页上页示如下

如果网页上提交的是用户名和密码等,通过键值对发送到服务端。

一组键值代表一个标签及标签对应的值。

在网页上选择一张图片,并使用post方式提交,在服务端打印request.POST

    def index(request):
if request.method=="POST":
print(request.POST) return render(request,"index.html",locals())

打印的信息如下:

<QueryDict: {'csrfmiddlewaretoken': ['opmSmENIrgdGJJN'], 'up_file': ['1.png']}>

提交的文件名也在这个字典中,取出这个文件名

    def index(request):
if request.method=="POST":
print(request.POST.get("up_file"))
print(type(request.POST.get("up_file"))) return render(request,"index.html",locals())

打印结果如下:

1.png
<class 'str'>

想取出的是上传的文件,然而取出来的却是上传的文件的文件名

由此可知,上传的文件没有跟form表单提交的数据在一起

因为上传的文件通常大小比较大,所以Django默认会把上传的文件放在一个具体的文件夹中

打印request.FILES的信息

    def index(request):
if request.method=="POST":
print(request.POST.get("up_file"))
print(type(request.POST.get("up_file")))
print("files:",request.FILES) return render(request,"index.html",locals())

打印结果如下

1.png
<class 'str'>
files: <MultiValueDict: {}>

request.FILES打印的结果是一个空的字典,问题出在上传文件的方式上

由于上传文件时在客户端与服务端传输的是二进制数据,与字符串数据不一样。

传输二进制数据,不管是在form表单,还是在Ajax中,都有自己的传输方式。

在form表单中,上传文件时要使用分片传输的方式。

修改index.html文件

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h4>{{ error_message }}</h4>
<form action="/index/" method="post" enctype="multipart/form-data">
{% csrf_token %}
<p><input type="file" name="up_file"></p>
<input type="submit">
</form>
</body>
</html>

重新上传文件,在服务端打印信息如下

None
<class 'NoneType'>
files: <MultiValueDict: {'up_file': [<InMemoryUploadedFile: 1.png (image/png)>]}>

根据打印结果,request.FILES中可以看到上传的文件

打印结果是一个字典类型,字典的键是form表单中定义的标签的name属性值,而其值是所上传的文件的对象

打印上传文件的对象

def index(request):
if request.method=="POST": print("files:",request.FILES.get("up_file"))
print(type(request.FILES.get("up_file"))) return render(request,"index.html",locals())

打印结果

files: 1.png
<class 'django.core.files.uploadedfile.InMemoryUploadedFile'>

结果显示所取得的文件的类型是一个在内存中的上传文件

获取上传文件在内存中的名字

def index(request):
if request.method=="POST": print(type(request.FILES.get("up_file"))) file_obj=request.FILES.get("up_file") print(file_obj.name) return render(request,"index.html",locals())

打印结果如下

<class 'django.core.files.uploadedfile.InMemoryUploadedFile'>
1.png

既然知道了文件在内存中的名字,就可以在服务端写入这个文件

def index(request):
if request.method=="POST":
file_obj=request.FILES.get("up_file") f1=open(file_obj.name,"wb") for i in file_obj.chunks():
f1.write(i) f1.close() return render(request,"index.html",locals())

再次选择上传文件,提交后,就可以在服务端后台看到所上传的文件

可以在settings.py文件中设定上传文件的路径,或者在打开文件句柄的时候进行路径拼接来把上传的文件保存在指定的目录下

Django的form表单之文件上传的更多相关文章

  1. Ajax提交Form表单及文件上传

    刚刚申请下来的博客,写得第一篇.有点小激动,本人以前是一名工业3D设计师突然有些变故做上了JavaWeb开发: 前几天,发现了一些小问题.我在写后台管理页面时,需要上传一张图片.于是我就用很普通的Fo ...

  2. php+form表单的文件上传

    <!doctype html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. 2020最新Servlet+form表单实现文件上传(图片)

    servlet实现文件上传接受 这几天学了一点文件上传,有很多不会,在网查了许多博客,但是最新的没有,都比较久了 因为我是小白,版本更新了,以前的方法自己费了好久才弄懂,写个随笔方便以后查找 代码奉上 ...

  4. form表单多文件上传

    1.html/jsp主页 <%@ page language="java" contentType="text/html; charset=UTF-8" ...

  5. Django框架 之 Form表单和Ajax上传文件

    Django框架 之 Form表单和Ajax上传文件 浏览目录 Form表单上传文件 Ajax上传文件 伪造Ajax上传文件 Form表单上传文件 html 1 2 3 4 5 6 7 <h3& ...

  6. Struts2文件上传(基于表单的文件上传)

    •Commons-FileUpload组件 –Commons是Apache开放源代码组织的一个Java子项目,其中的FileUpload是用来处理HTTP文件上传的子项目   •Commons-Fil ...

  7. [原创]java WEB学习笔记49:文件上传基础,基于表单的文件上传,使用fileuoload 组件

    本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当 ...

  8. $_FILES参数详解及简单<form>表单无刷新上传文件

    $_FILES:经由 HTTP POST 文件上传而提交至脚本的变量,类似于旧数组$HTTP_POST_FILES 数组(依然有效,但反对使用)详细信息可参阅 POST方法上传 $_FILES数组内容 ...

  9. 通过Ajax提交form表单来提交上传文件

    Ajax 提交form方式可以将form表单序列化 然后将数据通过data提交至后台,例如: $.ajax({      url : "http://localhost:8080/" ...

随机推荐

  1. JavaScript中事件

    JS中的事件 一.事件分类: 鼠标事件:鼠标单击.鼠标双击.鼠标指上等... HTML事件:文档加载.焦点.表单提交等... 键盘事件:键盘按下(keydown).键盘按下并松开瞬间(keypress ...

  2. [Unity 设计模式]桥接模式(BridgePattern)

    1.前言 继上一讲IOC模式的基础上继续本讲桥接模式,笔者感觉桥接模式是23种设计模式中桥接模式是最好用但也是最难理解的设计模式之一,23中设计模式就好武侠剧中一本武功秘籍,我们在工作过程中想要熟练运 ...

  3. 集美大学网络1413第七次作业成绩(团队三) --需求改进&系统设计

    题目 团队作业3--需求改进&系统设计 团队作业3成绩  团队/分值 TD BZ GJ CJ SI WBS GS JG DB SS SJ CS DC 总分  1 0.25 0.75 1 0.5 ...

  4. 【集美大学1411_助教博客】团队作业6——展示博客(Alpha版本)

    写在前面的话 工作还真是应该抓紧做呢,以下评分是助教在出差前评的,但出差回来就忘记了大部分内容.同学们都在预期时间内完成了自己的alpha项目.由于助教的频繁出差,评分工作落下一大截,在此表示欠意,会 ...

  5. Java学习6——基本数据类型及其转换

    Java常量: Java的常量值用字符串表示,区分不同的数据类型 整型常量123.浮点型常量3.14.字符常量'a'.逻辑常量true.字符串常量"helloworld". ps: ...

  6. 201521123040《Java程序设计》第4周学习总结

    1. 本周学习总结 1.1 尝试使用思维导图总结有关继承的知识点. 1.2 使用常规方法总结其他上课内容. 本周学习了类的继承,包括子类父类的概念还有extends关键字,super关键字.继承与代码 ...

  7. 201521123021第二周Java学习总结

    1.本章学习总结 ①初步掌握了Java程序简单的输入和输出. ②回顾了运算符和表达式的使用. ③在数据类型的学习的中,要注意各类型的取值范围,特别是byte型范围很小,若为128即溢出. ④在Java ...

  8. 2017Java课程设计201521123007

    1. 课程设计博客链接 项目地址 2. 个人负责模块或任务说明 ps:一个人做的项目 一个登录jsp文件,登录成功转入商品界面, 一个商品jsp文件,显示所有商品信息,数据从MySql数据库导入,可以 ...

  9. TCP/IP协议:OSI七层模型、TCP/IP四层模型的对比

    1. OSI七层和TCP/IP四层的关系 1.1 OSI引入了服务.接口.协议.分层的概念,TCP/IP借鉴了OSI的这些概念建立TCP/IP模型. 1.2 OSI先有模型,后有协议,先有标准,后进行 ...

  10. Java多线程高并发学习笔记(三)——深入理解线程池

    线程池最核心的一个类:ThreadPoolExecutor. 看一下该类的构造器: public ThreadPoolExecutor(int paramInt1, int paramInt2, lo ...