分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 前端开发

Django文件上传

发布时间:2023-09-06 01:36责任编辑:苏小强关键词:文件上传
一、form表单上传

1.页面代码

<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>Title</title></head><body><form action="{% url ‘upload‘ %} " method="post" enctype="multipart/form-data"> ???{% csrf_token %} ???<input type="file" name="img"> ???<input type="submit"></form></body></html>

2.后端view函数处理

def upload(request): ???if request.method=="GET": ???????return ?render(request,‘upload.html‘) ???elif request.method=="POST": ???????res={"status":"success","code":999} ???????img_obj=request.FILES.get(‘img‘)#获取文件对象 ???????with open(os.path.join(‘static‘,img_obj.name),"wb") as f: ???????????for chunk in img_obj.chunks(chunk_size=1024): ???????????????f.write(chunk) ???????return HttpResponse(json.dumps(res))
二、利用Jquery中ajax+FormData实现上传文件

上传步骤:

1.页面代码

<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>Title</title></head><body><form action="{% url ‘upload‘ %} " method="post" enctype="multipart/form-data"> ???{% csrf_token %} ???<input type="file" name="img"></form><span style="padding: 5px;color: royalblue" onclick="Jqajax();">jq上传</span><script type="text/javascript" src="/static/jquery-2.1.1.min.js"></script><script type="text/javascript" src="/static/jquery.cookie.js"></script><script> ???function Jqajax() { ??????var file_obj=$(‘input[name="img"]‘)[0].files[0];//获取dom形式的文件对象 ??????var form_obj=new FormData(); ??//创建formdata对象 ??????form_obj.append(‘img‘,file_obj); ??//将文件对象加载formdata中 ???????$.ajaxSetup({ ????????????????????//设置csrf_token ???????????beforeSend: function (xhr, settings) { ???????????????????xhr.setRequestHeader("X-CSRFToken", $.cookie("csrftoken")); ???????????} ???????}); ??????$.ajax({ ??????????type: ‘POST‘, ??????????url: ‘{% url ‘upload‘ %}‘, ??????????data: form_obj,//指明发送的文件对象 ??????????processData: false, // 告诉jquery要传输data对象 ??????????contentType: false, ??// 告诉jquery不需要增加请求头对于contentType的设置 ???????????????success: function (data) { ???????????????????console.log(data) ??????????} ??????}) ???}</script></body></html>

后端处理逻辑不变

Django文件上传

原文地址:https://www.cnblogs.com/wdliu/p/8290255.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved