Django之三种文件上传
方式一:
通过form表单提交到后台
前端:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="/upload/" method="post" enctype="multipart/form-data">
<input type="file" name="fafafa">
<input type="submit">
</form>
</body>
</html>
Django 后端:
def upload(request):
if request.method == 'POST':# 获取对象
obj = request.FILES.get('fafafa')
import os
# 上传文件的文件名
print(obj.name) f = open(os.path.join(BASE_DIR, 'static', 'pic', obj.name), 'wb')
for chunk in obj.chunks():
f.write(chunk)
f.close()
return HttpResponse('OK')
return render(request, 'upload/upload.html')
方式二:
通过ajax提交
前端
<div>
<input type="file" name="file" id="file_upload">
<input type="button" value="上传" onclick="FileUpload()">
</div>
JS:
<script src="/static/js/jquery-3.2.1.min.js"></script>
<script>
function FileUpload() {
var form_data = new FormData();
var file_info =$( '#file_upload')[0].files[0];
form_data.append('file',file_info);
//if(file_info==undefined)暂且不许要判断是否有附件
//alert('你没有选择任何文件');
//return false
$.ajax({
url:'/upload_ajax/',
type:'POST',
data: form_data,
processData: false, // tell jquery not to process the data
contentType: false, // tell jquery not to set contentType
success: function(callback) { console.log('ok')
}
}); }</script>
Django 后端:
def upload_ajax(request):
if request.method == 'POST':
file_obj = request.FILES.get('file')
import os
f = open(os.path.join(BASE_DIR, 'static', 'pic', file_obj.name), 'wb')
print(file_obj,type(file_obj))
for chunk in file_obj.chunks():
f.write(chunk)
f.close()
print('11111')
return HttpResponse('OK')
注意:
前台发送ajax请求时:
processData: false, // tell jquery not to process the data
contentType: false, // tell jquery not to set contentType
必须设置
方式三:通过iframe标签提交:
httml
<h1>测试Imframe</h1>
<input type="text" id="url">
<input type="button" value="点击" onclick="iframeChange()">
<iframe id="ifr" src=""></iframe>
<hr/>
<h1>基于iframe实现formt提交 </h1>
<form action="/upload_Formdata.html" method="post" target="iframe_123" enctype="multipart/form-data">
<iframe id="iframe_1" name="iframe_123" src="" onload="loadIframe();"></iframe>
<input type="text" name="user">
<input type="file" name="fafafa">
<input type="submit">
</form>
js:这里from标签的target和iframe的那么保持一致,form提交后会跳转到或者链接到iframe
<script src="/static/jquery-2.1.4.min.js"></script>
<script>
function iframeChange() {
var url = $('#url').val();
$('#ifr').attr('src',url)
}
function loadIframe() {//iframe加载完后执行
console.log(1)
//获取iframe内部的内容
var str_json = $('#iframe_1').contents().find('body').text()
var obj = JSON.parse(str_json)
if(obj.status){
var img = document.createElement('img');
img.src = "/" + obj.path;
$('#imgs').append(img);
}
} </script>
Django 后端:
import json
def upload_Formdata(request):
if request.method=="GET":
img_list=models.Img.objects.all()
return render(request,'upload_Formdata.html',{"img_list":img_list})
elif request.method=="POST":
obj=request.FILES.get('fafafa')
file_path=os.path.join('static','upload',obj.name)
f=open(file_path,'wb') for chunk in obj.chunks():
f.write(chunk)
f.close() models.Img.objects.create(path=file_path)
ret = {'status':True,'path':file_path,'text':123}
return HttpResponse(json.dumps(ret))
以上是文件上传的三种方式,在Tornado种也可以使用。
扩展:
在前段提交的时候 可以存在 checkbox 标签, 在Django中对于这种标签在后台获取值时用:
request.POST.getlist('favor', None) checkbox
其它
request.POST.get('favor', None) checkbox

def upload(request):
if request.method == 'POST':# 获取对象
obj = request.FILES.get('fafafa')
import os
# 上传文件的文件名
print(obj.name) f = open(os.path.join(BASE_DIR, 'static', 'pic', obj.name), 'wb')
for chunk in obj.chunks():
f.write(chunk)
f.close()
return HttpResponse('OK')
return render(request, 'upload/upload.html')

方式二:
通过ajax提交
前段
<div>
<input type="file" name="file" id="file_upload">
<input type="button" value="上传" onclick="FileUpload()">
</div>
JS:

<script src="/static/js/jquery-3.2.1.min.js"></script>
<script>
function FileUpload() {
var form_data = new FormData();
var file_info =$( '#file_upload')[0].files[0];
form_data.append('file',file_info);
//if(file_info==undefined)暂且不许要判断是否有附件
//alert('你没有选择任何文件');
//return false
$.ajax({
url:'/upload_ajax/',
type:'POST',
data: form_data,
processData: false, // tell jquery not to process the data
contentType: false, // tell jquery not to set contentType
success: function(callback) { console.log('ok')
}
}); }</script>

Django 后端:

def upload_ajax(request):
if request.method == 'POST':
file_obj = request.FILES.get('file')
import os
f = open(os.path.join(BASE_DIR, 'static', 'pic', file_obj.name), 'wb')
print(file_obj,type(file_obj))
for chunk in file_obj.chunks():
f.write(chunk)
f.close()
print('11111')
return HttpResponse('OK')

注意:
前台发送ajax请求时:
processData: false, // tell jquery not to process the data
contentType: false, // tell jquery not to set contentType
必须设置 方式三:
通过iframe标签提交
前段:

<div>
<form id="my_form" name="form" action="/upload_iframe/" method="POST" enctype="multipart/form-data">
<input type="text" name="user">
<input type="password" name="password">
<input type="file" name="file">
<input type="button" value="upload" onclick="UploadFile()">
</form>
<iframe id='my_iframe' name='my_iframe' src="" class="hide"></iframe>
</div>

JS:

function UploadFile() {
document.getElementById('my_iframe').onload = Testt;
document.getElementById('my_form').target = 'my_iframe';
document.getElementById('my_form').submit();
}
function Testt(ths){
var t = $("#my_iframe").contents().find("body").text();
console.log(t);
}

Django 后端:

def upload_iframe(request):
if request.method == 'POST':
print(request.POST.get('user', None))
print(request.POST.get('password', None))
file_obj = request.FILES.get('file')
import os
f = open(os.path.join(BASE_DIR, 'static', 'pic', file_obj.name), 'wb')
print(file_obj,type(file_obj))
for chunk in file_obj.chunks():
f.write(chunk)
f.close()
print('11111')
return HttpResponse('OK')

参考学习:https://www.cnblogs.com/jishuweiwang/p/6140132.html
以上是文件上传的三种方式,在Tornado种也可以使用。
扩展:
在前段提交的时候 可以存在 checkbox 标签, 在Django中对于这种标签在后台获取值时用:
request.POST.getlist('favor', None) checkbox
其它
request.POST.get('favor', None) checkbox
Django之三种文件上传的更多相关文章
- 第三百一十九节,Django框架,文件上传
第三百一十九节,Django框架,文件上传 1.自定义上传[推荐] 请求对象.FILES.get()获取上传文件的对象上传对象.name获取上传文件名称上传对象.chunks()获取上传数据包,字节码 ...
- Django之Ajax文件上传
请求头ContentType ContentType指的是请求体的编码类型,常见的类型共有3种: 1 application/x-www-form-urlencoded(看下图) 这应该是最常见的 P ...
- python 全栈开发,Day75(Django与Ajax,文件上传,ajax发送json数据,基于Ajax的文件上传,SweetAlert插件)
昨日内容回顾 基于对象的跨表查询 正向查询:关联属性在A表中,所以A对象找关联B表数据,正向查询 反向查询:关联属性在A表中,所以B对象找A对象,反向查询 一对多: 按字段:xx book ----- ...
- Django实现任意文件上传(最简单的方法)
利用Django实现文件上传并且保存到指定路径下,其实并不困难,完全不需要用到django的forms,也不需要django的models,就可以实现,下面开始实现. 第一步:在模板文件中,创建一个f ...
- python django web 端文件上传
利用Django实现文件上传并且保存到指定路径下,其实并不困难,完全不需要用到django的forms,也不需要django的models,就可以实现,下面开始实现. 第一步:在模板文件中,创建一个f ...
- Django与Ajax,文件上传,ajax发送json数据,基于Ajax的文件上传,SweetAlert插件
一.Django与Ajax AJAX准备知识:JSON 什么是 JSON ? JSON 指的是 JavaScript 对象表示法(JavaScript Object Notation) JSON 是轻 ...
- 16.Django学习之文件上传和下载
上传就这么六步! 一. settings配置文件中配置 MEDIA_URL = '/media/' MEDIA_ROOT = os.path.join(BASE_DIR, 'medias').repl ...
- django 快速实现文件上传
前言 对于web开来说,用户登陆.注册.文件上传等是最基础的功能,针对不同的web框架,相关的文章非常多,但搜索之后发现大多都不具有完整性,对于想学习web开发的新手来说就没办法一步一步的操作练习:对 ...
- Day21 Django之Form文件上传、原生Ajax和实现抽屉实例
一.Form文件上传 """ Django settings for prev_chouti project. Generated by 'django-admin st ...
随机推荐
- [ERROR] InnoDB: ibdata1 different size (rounded down to MB)
启动mysql实例报错,查看 error log ## 错误信息2018-08-31T10:38:36.945081Z 0 [ERROR] InnoDB: The Auto-extending inn ...
- JSBridge 知识点
比较好的介绍文章: Android中JSBridge的原理与实现
- pyquery的使用
常用的三种初始化方法: 1.字符串初始化: from pyquery import PyQuery as pq html=""" <html> <hea ...
- 解决新版本Vivado打开老工程IP锁住的问题
解决新版本Vivado打开老工程IP锁住的问题 1.生成IP核的状态报告 Tools -> Report -> Report IP Status 2.点击Upgrade Selected ...
- Docker+Nginx部署Angular
在部署Angular生产环境之前,需要电脑已经安装docker. 添加Dockerfile在已经完成的Angular项目的项目根目录下添加Dockerfile文件. Dockerfile文件内容: F ...
- Fiddler的学习之路
Fiddler是位于客户端和服务器端的HTTP代理,也是目前最常用的http抓包工具之一 . 它能够记录客户端和服务器之间的所有 HTTP请求,可以针对特定的HTTP请求,分析请求数据.设置断点.调试 ...
- PCM简介
1. 差分脉冲编码调制 如果两个相邻抽样值之间的相关性很大,那么它们的差值就较小,这样,仅对差值量化可以使用较少的比特数,此即差分PCM,或DPCM. 为了理论方便,我们将采样和量化分开,并用不带上三 ...
- SQL判断某列中是否包含中文字符或者英文字符
SQL判断某列中是否包含中文字符或者英文字符 [sql] select * from 表名 where 某列 like '%[吖-座]%' select * from 表名 where ...
- PureMVC剖析
http://www.cnblogs.com/skynet/archive/2013/01/29/2881244.html http://hi.baidu.com/mmforever/item/408 ...
- zTree分批异步加载方式下实现节点搜索功能(转载)
原文地址:https://segmentfault.com/a/1190000004657854 最近公司做一个项目用到zTree,zTree功能强大就不用多说了,相信用过的人都知道. 公 ...