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

 更新时间:2020年03月09日 08:52:35   作者:PythonNew_Mr.Wang  
这篇文章主要介绍了Django 接收所有文件,前端展示文件(包括视频,文件,图片)ajax请求,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值 ,需要的朋友可以参考下

如果是后台上传文件:

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

总结

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

相关文章

  • Python常用GUI框架原理解析汇总

    Python常用GUI框架原理解析汇总

    这篇文章主要介绍了Python常用GUI框架原理解析汇总,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-12-12
  • python实现各进制转换的总结大全

    python实现各进制转换的总结大全

    这篇文章主要给大家总结了python实现各进制转换的相关资料,其中包括字符串与十六进制转换、内置函数hex()与进制互转等相关内容,需要的朋友可以参考借鉴,下面来一起看看吧。
    2017-06-06
  • 使用Python代码实现Linux中的ls遍历目录命令的实例代码

    使用Python代码实现Linux中的ls遍历目录命令的实例代码

    这次我就要试着用 Python 来实现一下 Linux 中的 ls 命令, 小小地证明下 Python 的不简单,需要的朋友可以参考下
    2019-09-09
  • 浅谈pandas中shift和diff函数关系

    浅谈pandas中shift和diff函数关系

    下面小编就为大家分享一篇浅谈pandas中shift和diff函数关系,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-04-04
  • 详解python的数字类型变量与其方法

    详解python的数字类型变量与其方法

    大家都知道数字数据类型存储数值,它们是不可变的数据类型,这意味着改变数据类型的结果值,需要一个新分配的对象。这篇文章给大家详细介绍了python的数字类型变量以及其方法,文中介绍的很详细,相信对大家的理解和学习很有帮助,有需要的朋友们可以参考借鉴。
    2016-11-11
  • python实现字符串和字典的转换

    python实现字符串和字典的转换

    这篇文章主要为大家详细介绍了python实现字符串和字典的转换,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-09-09
  • Python脚本读取Consul配置信息的方法示例

    Python脚本读取Consul配置信息的方法示例

    本文主要介绍了Python脚本读取Consul配置信息的方法示例,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-11-11
  • iPython pylab模式启动方式

    iPython pylab模式启动方式

    这篇文章主要介绍了iPython pylab模式启动方式,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-04-04
  • freeswitch开源通信 python模块介绍

    freeswitch开源通信 python模块介绍

    freeswitch支持多种语言的业务开发,包括C/C++,java,python,js,lua,Golang等等。freeswitch在使用python做业务开发时,有俩种接入方式,一种是ESL接口,另一种是mod_python模块。本文主要介绍的是fs内部的mod_python语言支持模块,需要的朋友可以参考下面文章内容
    2021-09-09
  • Python计算一个文件里字数的方法

    Python计算一个文件里字数的方法

    这篇文章主要介绍了Python计算一个文件里字数的方法,涉及Python文件操作及内容遍历的相关技巧,需要的朋友可以参考下
    2015-06-06

最新评论