如果是后台上传文件:

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="imagess">链接</a>

</div>

</div>

<br>

<br>

<br>

<br>

<div>

    {#    href="/static/img/TC代码.txt" #}

    <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("", 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请求的更多相关文章

  1. 我的Android进阶之旅------>Android使用正则表达式匹配扫描指定目录下的所有媒体文件(音乐、图像、视频文件)

    今天使用正则表达式匹配指定目录下的所有媒体文件,下面将这份代码简化了,可以收藏下来,当作工具类. package match; import java.io.File; import java.uti ...

  2. 如何在微信中发送"相册"文件时有选择性地显示视频文件

    相信很多微信用户在使用微信给朋友,同事发送相册中的文件时,微信会显示你手机中的视频文件,这样很不方便. 如果要完全不显示视频文件: 随便在手机中建立一个文件夹,名字叫 ".nomedia&q ...

  3. Django（十二）视图--利用jquery从后台发送ajax请求并处理、ajax登录案例

    一.Ajax基本概念 [参考]:https://www.runoob.com/jquery/jquery-ajax-intro.html 异步的javascript.在不全部加载某一个页面部的情况下, ...

  4. Django结合Echarts在前端展示数据

    前言 最近在用Django写UI自动化测试平台,基本快要弄完了,但是首页只有项目列表展示,一直感觉很空旷,所以想把一些关键数据在首页展示出来. 这时就想到利用Echarts这个开源项目,但是Djang ...

  5. layui上传文件前端报404，实际文件已经上传成功

    原因:上传回调的方法接收的参数应该是json格式的,之前返回的是String,所以一直走异常的方法 第一种 在后台上加上@ResponseBody 第二种 @ResponseBody @Request ...

  6. 巨蟒django之权限9:前端展示修改删除合并&&权限展示

    1.权限组件控制流程(硬核重点) 2.权限组件控制流程 3.角色管理 4.删除合并 5.权限展示

  7. 查找存在某字符的文件列表，不包括svn文件

    find . ! -wholename '*.svn*' -print | xargs grep "img" | awk -F ':.' '{print $1}' | uniq

  8. idea引入项目下所有文件（ps：包括静态文件夹）

    打开项目的目录结构 点击finish 最后删除目录下多余的src就可以了

  9. 【前端学习笔记】2015-09-11~~~~ js中ajax请求返回案例

    <body><textarea id='a' rows=100 cols=300>result:</textarea>><script>var a ...

  10. FFmpeg命令行工具和批处理脚本进行简单的音视频文件编辑

    FFmpeg_Tutorial FFmpeg工具和sdk库的使用demo 一.使用FFmpeg命令行工具和批处理脚本进行简单的音视频文件编辑 1.基本介绍 对于每一个从事音视频技术开发的工程师,想必没 ...

随机推荐

  1. 绿洲作业第一周 - Y3每日中文学习任务清单

    尽量每天完成一首古诗. 如果孩子另有学习安排,可在周日(2.16)23:59前,完成任务.有兴趣.学有余力的孩子可以自我拓展其中的“寒假读诗”.

  2. 看了这个Java实习生入职测试题后，幸亏我不是实习生

    看了这个Java实习生入职测试题后,幸亏我不是实习生 一个Java实习生的入职测试题,你能答对几个? 今天在某APP中看到,有实习生放出的Java实习生入职测试题.看完之后,很庆幸自己不是实习生. 本 ...

  3. input之按键输入

    通过直接操作驱动来监控键盘,只要程序一旦在后台启动,无论在任何页面都可以监控到按键的数值. 步骤如下: 1.找到键盘挂在点:有两种方法 方法一:在   /dev/input路径下通过  cat eve ...

  4. spring boot 配置文件properties和YAML详解

    spring boot 配置文件properties和YAML详解 properties中配置信息并获取值. 1:在application.properties配置文件中添加: 根据提示创建直接创建. ...

  5. 关于JavaScript中的typeof与instanceof

    JavaScript中typeof和instanceof可以用来判断一个数据的类型,什么时候选择使用typeof?什么时候选择使用instanceof? typeof运算符 typeof运算符返回值有 ...

  6. python保留2位小数

    1 代码: ​ 2 运行结果: ​ 3 其中字符串形式的:print('%.2f' % (x/y))方式最好

  7. mysql中tinyint、smallint、int和bigint类型的用法区别

    mysql中tinyint.smallint.int和bigint类型的用法区别: 在MySQL的数据类型中,Tinyint的取值范围是:带符号的范围是-128到127.无符号的范围是0到255(见官 ...

  8. selenium&appium中的三种等待方式---基于python

    我们在实际使用selenium或者appium时,等待下个等待定位的元素出现,特别是web端加载的过程,都需要用到等待,而等待方式的设置是保证脚本稳定有效运行的一个非常重要的手段,在selenium中 ...

  9. python设置检查点简单实现

    说检查点,其实就是对过去历史的记录,可以认为是log.不过这里进行了简化.举例来说,我现在又一段文本.文本里放有一堆堆的链接地址.我现在的任务是下载那些地址中的内容.另外因为网络的问题或者网站的问题, ...

  10. Tian Tian 菾菾 导游 陪同

    自画像系列是梵高的代表作之一,他是一位自学成才的画家,下笔完全自由,主观提取了当时印象派画家学到的技巧,在这幅画中,我们可以看到,颜色在画中的堆叠,色彩与笔在画中表现的形态,都表现出,梵高在他作画中内 ...