浅析Django 接收所有文件,前端展示文件（包括视频，文件，图片）ajax请求
作者：PythonNew_Mr.Wang 时间：2023-03-30 14:35:25
如果是后台上传文件:
setting配置：
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'static'),
os.path.join(BASE_DIR, "media"),
]
# Django用户上传的都叫media文件
MEDIA_URL = "/media/"
# media配置，用户上传的文件都默认放在这个文件夹下
MEDIA_ROOT = os.path.join(BASE_DIR, "media")
model的配置：
img = models.FileField(upload_to="img/",verbose_name="图片")
接收任何文件的前端代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form method="post" action="/upload/" enctype="multipart/form-data" target="ifm1">
<input type="file" name="file" id="file"/>
<input type="button" value="提交" onclick="upload()"/>
</form>
<br>
<br>
<br>
<br>
<div>显示图片
<img id="images">
</div>
<br>
<br>
<br>
<br>
<div>显示路径
<a href="" id=" rel="external nofollow" imagess">链接</a>
</div>
</div>
<br>
<br>
<br>
<br>
<div>
{# href="/static/img/TC代码.txt" rel="external nofollow" #}
<a id="up"> 下载文件</a>
</div>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script>
function upload() {
var formData = new FormData();
var file = document.getElementById('file').files[0];
formData.append("file", file);
$.ajax({
url: "upload/",
type: "post",
data: formData,
dataType: "json",
cache: false, //上传文件无需缓存
processData: false,//用于对data参数进行序列化处理 这里必须false
contentType: false, //必须*/
success: function (data) {
console.log("22", data);
$("#images").attr("src", data.image)
$("#imagess").attr("href", data.image)
}
});
}
$("#up").on("click", function () {
$.ajax({
url: "http://127.0.0.1:8000/down/",
type: "get",
data: {},
success: function (data) {
var $a = $('<a></a>');
$a.attr("href", "http://127.0.0.1:8000/down/");
$("body").append($a);
$a[0].click();
$a.remove();
}
})
});
</script>
</body>
</html>
增加任何文件的后端接口代码：
from rest_framework.views import APIView
from django.shortcuts import render, redirect, HttpResponse
from dal import models
from django.http import JsonResponse
class ImageShow(APIView):
def post(self, request):
name = str(request.data.get("name"))
message = {}
img_url = "/static/img/{}".format(name)
obj = models.Car.objects.filter(img_url=img_url).first()
if obj :
message['code'] = 200
message['message'] = img_url # 返还路径
return JsonResponse(message)
下载文件后端：
from django.utils.http import urlquote
from rest_framework.views import APIView
from django.shortcuts import render, redirect, HttpResponse
from dal import models
from django.http import JsonResponse, FileResponse, StreamingHttpResponse
class fileShow(APIView):
def get(self, request):
message = {}
file = open('media/img/TC代码.txt','rb') # 字符串替换成文件
print("file",file.name)
# file_names = file.name.split('/')[-1]
# print("file_names",file_names)
response = FileResponse(file)
response['Content-Type'] = 'application/octet-stream'
response['Content-Disposition'] = "attachment;filename={}".format(urlquote("TC代码.txt")) # 字符串替换成下载文件
print(response)
return response
来源：https://www.cnblogs.com/wanghong1994/p/12442442.html
标签：django,接收,文件,ajax,请求
0
投稿猜你喜欢
解决pytorch 模型复制的一些问题
2022-04-23 03:57:58
解决SecureCRT通过SSH连接Ubuntu时vi命令有多余的m的问题
2023-11-19 19:32:24
用doctype激活浏览器模式
2009-06-15 19:02:00
基于javascript实现tab选项卡切换特效调试笔记
2024-06-12 13:48:02
获取CSDN文章内容并转换为markdown文本的python
2021-04-05 08:32:15
中文段首不需要空两格
2010-04-23 20:31:00
python3 判断列表是一个空列表的方法
2022-02-03 09:40:07
go实现一个分布式限流器的方法步骤
2024-04-28 10:46:36
vue后台管理添加多语言功能的实现示例
2024-04-29 13:08:22
浅谈PL/SQL批处理语句:BULK COLLECT与FORALL对优化做出的贡献
2024-01-14 01:04:27
vue使用canvas绘制圆环
2024-05-02 17:04:29
Vue中如何优雅的捕获 Promise 异常详解
2023-07-02 16:56:14
ie7.0浏览器 兼容问题苦煞网站设计者
2007-08-08 17:11:00
Django+zTree构建组织架构树的方法
2023-08-13 06:17:54
tensorflow 恢复指定层与不同层指定不同学习率的方法
2023-08-27 23:09:14
numpy数组做图片拼接的实现（concatenate、vstack、hstack）
2022-10-23 15:21:21
Google首页的CSS Sprite
2007-09-29 21:36:00
c#操作附加数据库的方法
2024-01-22 06:10:06
Python PyQt5 Pycharm 环境搭建及配置详解（图文教程）
2023-06-23 12:44:34
下载 Firefox 3 中文版/英文版
2008-06-19 13:27:00
