Y11

1、创建新app，配置路由和settings（Y10博客有具体操作）

2、创建一个上传页面（html），在views中渲染页面，配置路由，配置css，引入css，引入共享文件jquery

3、创建common_static共享文件目录，templates/app前端页面目录，static静态文件目录。另外还要创建文件传入后要存储和读取的目录，如存取img，即创建file/img

4、在views中定义函数完成文件上传后存储的功能
（1）引入csrf验证模块，from django.views.decorators.csrf import csrf_exempt
（2）@csrf_exempt
（3）具体功能实现

def deal_file(request):# 获取前端传输的文件对象file_obj = request.FILES.get('file')# 获取文件类型img_type = file_obj.name.split('.')[1]# 将文件类型中的数据大写全部转换成小写img_type = img_type.lower()if img_type in ['png','jpg','jpeg','gif']:# 将图片存到指定目录# 获取当前时间的时间戳timestr = str(time.time()).replace('.','')# 获取程序需要写入的文件路径path = os.path.join(settings.BASE_DIR, 'app2/file/img/{0}{1}'.format(timestr, file_obj.name))# 根据路径打开指定的文件(以二进制读写方式打开)f = open(path,'wb+')# chunks将对应的文件数据转换成若干片段, 分段写入, 可以有效提高文件的写入速度, 适用于2.5M以上的文件for chunk in file_obj.chunks():f.write(chunk)f.close()msg = {'code':200, 'url':'http://127.0.0.1:8000/app2/pass_data/{0}{1}'.format(timestr,file_obj.name), 'error':''}else:# 存储失败, 返回错误信息msg = {'code':305, 'url':'', 'error':'暂不支持该类型'}return HttpResponse(json.dumps(msg))
# 定义函数完成指定服务器向前端返回指定文件
def pass_img_data(request, img_name):path = os.path.join(settings.BASE_DIR, 'app2/file/img/{0}'.format(img_name))if os.path.exists(path):
#         # 文件存在, 读取文件数据f = open(path, 'rb+')data = f.read()f.close()return HttpResponse(data)else:return HttpResponse('')

注意：
(1) 获取文件对象：file_obj = request.FILES.get(‘file’)，其中注意文件获取需要.FILES
(2) 导入time模块, 利用时间戳给每一张图片设定唯一名字
(3) 通过.format将时间戳和图片名字拼接一起
(4) 文件写入必须是二进制方式写入
(5) chunks将对应的文件数据转换成若干片段, 分段写入, 可以有效提高文件的写入速度, 适用于2.5M以上的文件

5、在urls.py中配置对应路由

from django.contrib import admin
from django.urls import path
from . import views
urlpatterns = [path('upload/', views.render_upload, name="upload"),path('deal_file/<str:account>/', views.deal_file, name="deal_file"),path('pass_data/<str:account>/<str:img_name>/', views.pass_img_data, name="pass_data"),
]

6、在传入页面中,写JS代码

<script src="{%static 'js/jquery.min.js'%}"></script>
<script src="{%static 'js/csrf.js'%}"></script>
<script type="text/javascript">// 该事件用来监听文件上传控件是否选择好指定文件$('#file').on('change',function () {//获取文件选择控件选择的图片对象//let file_c = document.getElementById('file');let file_c = $('#file').get(0);// files是input[type=file]的属性， 用来存储文件选择控件选择的图片对象， 是一个数组类型let file_obj = file_c.files[0];// 将文件类型的数据打包成form表单数据let formD = new FormData();formD.append('file',file_obj);//正式进行数据传输create_csrf(); //生成csrf——token$.ajax({url:'{%url "deal_file"%}',type:'post',data:formD,// 数据传输过程中不需要将数据转换成字符串processData:false,// ajax传输数据过程中不需要重新设置数据的编码格式contentType:false,success:function (res) {let msg = JSON.parse(res);if(msg.code == 200){$('#photo').attr('src',msg.url);}else {alert(msg.error);}}});});

注意：在文件上传时，form表单的数据传输方式必须为post，并且编码格式为multipart/form-data，否则服务器是无法获取传输的文件数据

<form method="post" enctype="multipart/form-data">

若需要查看具体代码，在此分享本人创建过的供学习的django工程（以上为工程django_2）：
链接：https://pan.baidu.com/s/1v74l_n_1F5WoRxOb7YlRjg
提取码：ev9p

个人小结，定有不足之处，欢迎指点。
谢谢~

django文件上传功能的实现相关推荐

Django文件上传***
分别用三种Django文件上传方式(form方式.jQuery+jQuery.ajax方式.原生JS+原生ajax方式)做上传功能示例文件文件释义 form_upload.html form上传文 ...
实现HTTP协议Get、Post和文件上传功能——使用libcurl接口实现
之前我们已经详细介绍了WinHttp接口如何实现Http的相关功能.本文我将主要讲解如何使用libcurl库去实现相关功能.(转载请指明出于breaksoftware的csdn博客) libcurl在 ...
实现HTTP协议Get、Post和文件上传功能——使用WinHttp接口实现
在<使用WinHttp接口实现HTTP协议Get.Post和文件上传功能>一文中,我已经比较详细地讲解了如何使用WinHttp接口实现各种协议.在最近的代码梳理中,我觉得Post和文件上传 ...
Spring MVC环境中的文件上传功能实现
在实际开发过程中,尤其是web项目开发,文件上传和下载的需求的功能非常场景,比如说用户头像.商品图片.邮件附件等等.其实文件上传下载的本质都是通过流的形式进行读写操作,而在开发中不同的框架都会对文件上 ...
php用ajaxs上传图片_php+ajax实现图片文件上传功能实例
目前常用的异步文件上传功能有几种,比较多见的如使用iframe框架形式,ajax功能效果,以及flash+php功能,下面介绍ajax与iframe实现异步文件上传的功能的例子. 方法一,利用jque ...
Java文件上传功能代码 —— 普遍适用
版权声明:本文为博主原创文章,如需转载,请标明出处. https://blog.csdn.net/alan_liuyue/article/details/72782207 一. 前言通过之前的博 ...
query AjaxUpload实现多文件上传功能代码实例教程
在PHP网站开发中,文件上传功能时常用到,之前我已介绍过如何利用PHP实现文件上传功能.随着WEB技术的发展,用户体验成为衡量网站成功与否的关键,今天和大家分享如何在PHP中利用Jquery实现Aja ...
学习ASP.NET Core Razor 编程系列十三——文件上传功能（一）
原文:学习ASP.NET Core Razor 编程系列十三--文件上传功能(一) 学习ASP.NET Core Razor 编程系列目录学习ASP.NET Core Razor 编程系列一学习A ...
springboot util 测试类怎么写_SpringBoot入门建站全系列（九）文件上传功能与下载方式...
SpringBoot入门建站全系列(九)文件上传功能与下载方式 Spring对文件上传做了简单的封装,就是用MultipartFile这个对象去接收文件,当然有很多种写法,下面会一一介绍. 文件的下载 ...

django文件上传功能的实现

Y11

django文件上传功能的实现相关推荐

最新文章

热门文章