首页 > 编程语言 >JavaScript ajax下载文件

JavaScript ajax下载文件

时间:2023-11-25 23:33:15浏览次数:32  
标签:search name val text JavaScript ajax let file 下载

 

JavaScript Ajax http get 方法,利用a标签下载文件流。

文件流:django返回文件流 示例

from django.http import StreamingHttpResponse


class DownloadExportExcel(View):
    def get(self, request, *args, **kwargs):
        file_name = request.GET.get("filename")
        # print("DownloadExportExcel file_name: ", file_name)
        def file_iterator(file_name, chunk_size=512):
            with open(file_name, 'rb') as f:
                while True:
                    c = f.read(chunk_size)
                    if c:
                        yield c
                    else:
                        break

        tmp_file_path = getattr(settings, "SEARCH_ID_POUR_OUT_TMP_PATH", "/tmp")
        file_path = tmp_file_path + file_name
        # file_path = file_name
        response = StreamingHttpResponse(file_iterator(file_path))
        response['Content-Type'] = 'application/octet-stream'
        response['Content-Disposition'] = 'attachment;filename*=UTF-8\"{0}\"'.format(file_name)
        return response

ajax 前端请求示例

 

        function exportSearchResult(filter_company_name, thisElement) {
                let search_type_val = $('#select').val();
                let search_ids_val = trimNValue($('#ids').val());
                let filter_strs_val = trimValue($('#filter_textarea').val());
                let notice_val = trimValue($('#notice_textarea').val());
                let search_ak_start_time = trimValue($('#search_ak_start_time').val());
                let search_ak_end_time = trimValue($('#search_ak_end_time').val());
                let search_ak_size = trimValue($('#search_ak_size').val());
                let export_company_name = filter_company_name
                {# jquery获取调用本函数的元素 #}
                console.log(thisElement);
                if (filter_company_name != ""){
                    filter_strs_val = trimValue(filter_company_name)
                }

                let datas = {
                        'search_type': search_type_val,
                        'search_ids': search_ids_val,
                        'filter_strs': filter_strs_val,
                        'notice': notice_val,
                        'export_company_name': export_company_name,
                        csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val()
                    }
                if (search_type_val == "AK_LOG") {
                    datas["search_ak_start_time"] = search_ak_start_time
                    datas["search_ak_end_time"] = search_ak_end_time
                    datas["search_ak_size"] = search_ak_size
                }
                // 倒出提示
                let queryTime = "倒出Excel....  "
                $("#ordinary_message span").html(queryTime);
                $("#ordinary_message").removeClass("hide");
                flushQuerySecond = true;
                interval = setInterval(printSeconds, 1000, "导出中");
                {# 发起查询中禁用按钮,避免没查完又重复发起 #}
                thisElement.setAttribute("disabled", "disabled");
                thisElement.textContent = "导出中..." ;
                $.ajax({
                    type: 'POST',
                    url: '/export_excel',
                    data: datas,
                    success: function (text) {
                        // 这里是请求成功后的回调函数
                        // 您可以在这里处理文件下载的操作
                        var link = document.createElement('a');
                        link.style.display = 'none';
                        link.href = '/download_searchresult/?filename=' + encodeURIComponent(text);
                        link.setAttribute('download', text);
                        document.body.appendChild(link);
                        link.click();
                        document.body.removeChild(link);
                        console.log("下载完毕~")
                        flushQuerySecond = false;
                        let notice_text = $("#ordinary_message span").text().replaceAll("中.... 已", "") + " 倒出成功~,请看默认下载路径";
                        notice_text = notice_text.replaceAll("导出中", "")
                        notice_text = notice_text.replaceAll(".", "")
                        displayOrdinaryNewMessage(notice_text, 60000);
                        thisElement.removeAttribute("disabled");
                        thisElement.textContent = "导出Excel" ;
                    },
                    error: function (response) {
                        let err_message = JSON.stringify(response);
                        $('#result').html('<p>出错:' + err_message + '</p>');
                        flushQuerySecond = false;
                        let notice_text = $("#ordinary_message span").text().replaceAll("中.... 已", "") + " 倒出excel失败!!!";
                        displayOrdinaryNewMessage(notice_text, 60000);
                        thisElement.removeAttribute("disabled");
                        thisElement.textContent = "导出Excel" ;
                    }
                });
                {#let queryTime = "查询中....  "#}
                {#$("#ordinary_message span").html(queryTime);#}
                {#$("#ordinary_message").removeClass("hide");#}
                {#flushQuerySecond = true;#}
                {#interval = setInterval(printSeconds, 1000);#}
                {#displayOrdinaryNewMessage("查询中......", 120000)#}
            }

 

标签:search,name,val,text,JavaScript,ajax,let,file,下载
From: https://www.cnblogs.com/zhangmingda/p/17856348.html

相关文章

  • 微信小程序文件预览和下载-文件系统
    文件预览和下载在下载之前,我们得先调用接口获取文件下载的url然后通过wx.downloadFile将下载文件资源到本地wx.downloadFile({url:res.data.url,success:function(res){console.log('数据',res);}})tempFilePath就是临时临时文件路径。通过wx.openD......
  • 12-Linux系统上安装aspera并用其批量高速下载转录组数据
     #使用aspera能够帮助我们批量高速下载转录组等数据,现在使用conda进行安装condainstall-chccaspera-cli-y#检查是否安装成功,有东西出来就行ascp-h#另外看看asperaweb_id_dsa.openssh文件是不是在miniconda3/etc文件夹中,务必确认该文件的位置。#我们看看NCBI上面......
  • asp.net core webapi项目实例源代码锦集下载(72个)
    下载地址:http://www.80cxy.com/Blog/ResourceView?arId=202311251726127234f6oAkh所有代码实例(Chinese)物业收费系统,使用ASP.NETCoreMVC框架.netcorewebapi配合swagger以及其他常用功能的单层项目.NETCore实战项目之CMS系列教程的源码Asp.NetCore项目中,以服务......
  • 解决Gradle下载太慢的问题
    解决Gradle下载太慢的问题2023年11月15日14:1362浏览 · 0喜欢 · 0评论七彩叶1A粉丝:425文章:3关注 留着自用镜像源:https://mirrors.cloud.tencent.com/gradle/选择对应版本下载链接,替换修改gradle-wrapper.properties中的distributionUrl即可。......
  • JavaWeb中的文件上传和下载功能的实现
    导入相关支持jar包:commons-fileupload.jar,commons-io.jar对于文件上传,浏览器在上传的过程中是将文件以流的形式提交到服务器端的,如果直接使用Servlet获取上传文件的输入流然后再解析里面的请求参数是比较麻烦,所以一般选择采用apache的开源工具common-fileupload这个文件上传组件......
  • JavaWeb-文件的上传和下载
    文件上传1.要有一个form标签,method=post请求2.form标签的encType属性的值必须为multipart/form-data值3.在from标签中使用inputtype=file添加上传的文件4.编写服务器代码接收上传的数据Content-Type:表示提交的数据类型enctype="multipart/form-data":表示提交的数据,以多段(每......
  • TVBOX下载配置及本地包使用教程
    本文以电视上使用为准。【TVBOX软件下载】https://qiqi2020.lanzouq.com/b09svqv1cTVBOX有各种改版,这里推荐下载影视仓_5.0.13.apk,因为它支持“多仓”:【软件安装】打开电视上的“当贝助手”,用它来上传软件安装包,其它可以传文件到电视的软件也可以。选择文件快传:电脑浏览......
  • JavaWeb实现文件上传和下载
    环境配置:导入依赖jar包。commons-fileupload-1.4.jarcommons-io-2.6.jar上传表单的enctype属性enctype属性规定在发送到服务器之前应该如何对表单数据进行编码。语法<formenctype="value">1属性值值 描述application/x-www-form-urlencoded 在发送前编码所有字符(默认)multi......
  • Java Web 实现文件上传和下载接口功能
    1.上传java代码实现@ResponseBody@PostMapping("/upload")publicResponseVoupload(@RequestParam(value="file",required=false)MultipartFilemultipartFile){Filefile=newFile("上传到服务器的文件地址");try{......
  • AJAX记录
    AJAX目录AJAX1.绑定事件点击判断类名的2.事件文件列表3.关联标签4.转义符号5.耦合性6.事件循环经典面试题1.绑定事件点击判断类名的document.querySelector('.list').addEventListener('click',(e)=>{if(e.target.classList.contains('edit')){editModal.sh......