首页 技术 正文
技术 2022年11月6日
0 收藏 979 点赞 553 浏览 2744 个字

form表单上传文件

urls.py

from django.conf.urls import url
from django.contrib import admin
from app01 import views
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^index/$',views.index),
url(r'^upload_file/$', views.upload_file),]

views.py

from django.shortcuts import render,HttpResponse,redirect
from app01 import models
from django.http import JsonResponse #这个模块就是向前端返回json格式数据def index(request):
return render(request,'index.html')def upload_file(request):
'''form表单的文件上传'''
# file是一个文件对象
file = request.FILES.get('myfile') #这个FILES就是指发送过来的所有的文件,是一个字典形式
files = r'D:\%s'%file.name
with open(files,'wb')as f:
for line in file:
f.write(line)
return HttpResponse('文件上传成功')

index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/bootstrap-3.3.7-dist/css/bootstrap.css" rel="external nofollow" rel="external nofollow" >
<script src="/static/jquery-3.3.1.js"></script>
<title>我是index页面</title>
</head>
<body>
<h1>form表单实现文件上传</h1>
{#form 表单上传文件一定要指定method的什么请求,然后enctye要指定格式 #}
<form action="/upload_file/" method="post" enctype="multipart/form-data">
<input type="file" name="myfile">
<input type="submit" value="上传文件">
</form>
</body>
</html>

Ajax 实现上传文件

PS:用Jquery获取文件,有固定的格式,$(‘#myfile’)就是根据id的名字获取到控件,$(‘#myfile’)[0]就是取到原生的dom,$(‘#myfile’)[0].files就会取到这个框内的所有文件(有可能是多个文件),$(‘#myfile’)[0].files[0]这个取第0个就是我当前传的文件

(23)ajax实现上传文件的功能

前后端交互有三种格式:urlencoded、formdata、json

1、默认是urlencoded格式(name=lqz&age=19)

2、上传文件要设置formdata格式

urls.py

from django.conf.urls import url
from django.contrib import admin
from app01 import views
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^index/$',views.index),
url(r'^login/$',views.login),
url(r'^upload_file/$', views.upload_file),]

views.py

from django.shortcuts import render,HttpResponse,redirectdef index(request):
return render(request,'index.html')def upload_file(request):
'''form表单的文件上传'''
file = request.FILES.get('myfile')
files = r'D:\%s'%file.name
with open(files,'wb')as f:
for line in file:
print(line)
f.write(line)
return HttpResponse('文件上传成功')

index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/bootstrap-3.3.7-dist/css/bootstrap.css" rel="external nofollow" rel="external nofollow" >
<script src="/static/jquery-3.3.1.js"></script>
<title>我是index页面</title>
</head>
<body>
<h1>ajax实现上传文件</h1>
<input type="file" name="myfile" id="myfile">
<button id="file_upload">点击上传文件</button></body><script>
{#ajax要上传文件必须借助FormData这个对象 #}
$('#file_upload').click(function () {
{#取到id为file的文件对象#}
var myfile = $('#myfile')[0].files[0]
{#生成一个空的FormData对象#}
var formdata = new FormData()
{#把文件放到formdata对象中,#}
formdata.append('myfile',myfile)
$.ajax({
url:'/upload_file/',
type:'post',
//要上传文件一定要指定这两个参数processData,contentType
processData:false, //不要预处理数据
contentType:false, //不指定编码格式
{#如果不写processData,则程序自己会以默认格式urlencode处理数据格式,也会指定默认的编码格式#}
//formdata这个对象会自己处理数据格式和编码格式 //直接把formdata对象放入data传到后台
data:formdata,
success:function (data) {
console.log(data)
}
})
})
</script>
</html>
相关推荐
python开发_常用的python模块及安装方法
adodb:我们领导推荐的数据库连接组件bsddb3:BerkeleyDB的连接组件Cheetah-1.0:我比较喜欢这个版本的cheeta…
日期:2022-11-24 点赞:878 阅读:8,982
Educational Codeforces Round 11 C. Hard Process 二分
C. Hard Process题目连接:http://www.codeforces.com/contest/660/problem/CDes…
日期:2022-11-24 点赞:807 阅读:5,499
下载Ubuntn 17.04 内核源代码
zengkefu@server1:/usr/src$ uname -aLinux server1 4.10.0-19-generic #21…
日期:2022-11-24 点赞:569 阅读:6,343
可用Active Desktop Calendar V7.86 注册码序列号
可用Active Desktop Calendar V7.86 注册码序列号Name: www.greendown.cn Code: &nb…
日期:2022-11-24 点赞:733 阅读:6,126
Android调用系统相机、自定义相机、处理大图片
Android调用系统相机和自定义相机实例本博文主要是介绍了android上使用相机进行拍照并显示的两种方式,并且由于涉及到要把拍到的照片显…
日期:2022-11-24 点赞:512 阅读:7,760
Struts的使用
一、Struts2的获取  Struts的官方网站为:http://struts.apache.org/  下载完Struts2的jar包,…
日期:2022-11-24 点赞:671 阅读:4,796