浅析Django 接收所有文件,前端展示文件（包括视频，文件，图片）ajax请求

时间：2021-05-22

如果是后台上传文件:

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 APIViewfrom django.shortcuts import render, redirect, HttpResponsefrom dal import modelsfrom django.http import JsonResponseclass 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 urlquotefrom rest_framework.views import APIViewfrom django.shortcuts import render, redirect, HttpResponsefrom dal import modelsfrom django.http import JsonResponse, FileResponse, StreamingHttpResponseclass 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

总结

到此这篇关于Django 接收所有文件 前端展示文件（包括视频，文件，图片）ajax请求的文章就介绍到这了,更多相关django 接收所有文件内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持！

声明：本页内容来源网络，仅供用户参考；我单位不保证亦不表示资料全面及准确无误，也不保证亦不表示这些资料为最新信息，如因任何原因，本网内容或者用户因倚赖本网内容造成任何损失或损害，我单位将不会负任何法律责任。如涉及版权问题，请提交至online#300.cn邮箱联系删除。

相关文章