精华内容
下载资源
问答
  • 后端返回文件流,前端需要对返回的文件流处理进行文件下载 先是发送请求的时候声明返回blob格式 url: '',(你的地址) method: 'post', data: params, responseType: 'blob' (这里很重要) 然后将返回的数据传给...

    后端返回文件流,前端需要对返回的文件流处理进行文件下载
    先是发送请求的时候声明返回blob格式

    url: '',(你的地址)
    method: 'post',
    data: params,
    responseType: 'blob'  (这里很重要)
    

    然后将返回的数据传给downLoadXls方法里,第二个形参是文件名称,然后系统就开始自动下载了~

    function downLoadXls(data, filename) {
            //var blob = new Blob([data], {type: 'application/vnd.ms-excel'})接收的是blob,若接收的是文件流,需要转化一下
        if (typeof window.chrome !== 'undefined') {
            // Chrome version
            var link = document.createElement('a');
            link.href = window.URL.createObjectURL(data);
            link.download = filename;
            link.click();
        } else if (typeof window.navigator.msSaveBlob !== 'undefined') {
            // IE version
            var blob = new Blob([data], { type: 'application/force-download' });
            window.navigator.msSaveBlob(blob, filename);
        } else {
            // Firefox version
            var file = new File([data], filename, { type: 'application/force-download' });
            window.open(URL.createObjectURL(file));
        }
    }
    
    展开全文
  • 后端返回文件流下载处理

    千次阅读 2020-05-05 14:13:00
    后端返回文件流下载模板处理 const content = res.data//接口返回文件流值 const blob = new Blob([content]) const fileName = ‘不符合情况清单.docx’ if (‘download’ in document.createElement(‘a’)) { //...

    后端返回文件流下载模板处理

    const content = res.data//接口返回文件流值
    const blob = new Blob([content])
    const fileName = ‘不符合情况清单.docx’
    if (‘download’ in document.createElement(‘a’)) { // 非IE下载
    const elink = document.createElement(‘a’)
    elink.download = fileName
    elink.style.display = ‘none’
    elink.href = URL.createObjectURL(blob)
    document.body.appendChild(elink)
    elink.click()
    URL.revokeObjectURL(elink.href) // 释放URL 对象
    document.body.removeChild(elink)
    } else { // IE10+下载
    navigator.msSaveBlob(blob, fileName)
    }

    展开全文
  • 前端下载EXCEL文件,后端返回文件流的处理 axios({ url: '下载接口URL', method: 'post', data: {}, responseType: 'blob' }).then((res) => { // data就是接口返回的文件流 let data = res.data if (data...

    转载:https://www.cnblogs.com/coconutGirl/p/12605562.html

    前端下载EXCEL文件,后端返回文件流的处理

    axios({
      url: '下载接口URL',
      method: 'post',
      data: {},
      responseType: 'blob'
    }).then((res) => {
      // data就是接口返回的文件流
      let data = res.data
      if (data) {
        let attrs = res.headers['content-disposition'].split(';')
      // 获取文件名
        let fileName = ''
        // 不用管fileName在第几个位置,只要=前面是fileName,就取=后面的值
        for (let i = 0, l = attrs.length; i < l; i++) {
          let temp = attrs[i].split('=')
          if (temp.length > 1 && temp[0] === 'fileName') {
            fileName = temp[1]
            break
          }
        }
        fileName = decodeURIComponent(fileName)
     
        // 获取数据类型
        let type = res.headers['content-type'].split(';')[0]
        let blob = new Blob([res.data], { type: type })
        const a = document.createElement('a')
     
        // 创建URL
        const blobUrl = window.URL.createObjectURL(blob)
        a.download = fileName
        a.href = blobUrl
        document.body.appendChild(a)
     
        // 下载文件
        a.click()
     
        // 释放内存
        URL.revokeObjectURL(blobUrl)
        document.body.removeChild(a)
      } else {
        console.log('error', data)
      }
    })
    

    **

    再强调下,一定一定不要忘了responseType: ‘blob’

    **

    补充:还有一种

    daochu() {
                this.loadingAll=true
                taskExport(this.params).then((res) => {
                    this.loadingAll=false
                    this.getOutExcel('任务统计.xlsx', res);
                });
            },
            getOutExcel(fileName, res) {
                let blob = new Blob([res], { type: 'application/x-xls' });
                if (window.navigator.msSaveOrOpenBlob) {
                    //兼容 IE & EDGE
                    navigator.msSaveBlob(blob, fileName);
                } else {
                    var link = document.createElement('a');
                    // 兼容不同浏览器的URL对象
                    const url = window.URL || window.webkitURL || window.moxURL;
                    // 创建下载链接
                    link.href = url.createObjectURL(blob);
                    //命名下载名称
                    link.download = fileName;
                    //点击触发下载
                    link.click();
                    //下载完成进行释放
                    url.revokeObjectURL(link.href);
                }
            },
    
    展开全文
  • 后端返回文件流,前端post请求接收并下载
    fetch('<接口地址>', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: '<请求参数:json字符串>',
    })
    .then(res => res.blob())
    .then(data => {
      let blobUrl = window.URL.createObjectURL(data);
      download(blobUrl);
    });
    
    function download(blobUrl) {
      const a = document.createElement('a');
      a.style.display = 'none';
      a.download = '导出的文件名';
      a.href = blobUrl;
      a.click();
      document.body.removeChild(a);
    }
    展开全文
  • 后端返回文件流格式前端应该如何处理? 如何将后端返回的文件流格式转换为Excel文件,并下载Excel文件? 带着这些问题看文章,希望对你有所帮助! 1. 应用场景 2. 代码块分析 3. 具体代码实现 1.应用场景 当后端...
  • // 文件下载,后端返回文件流方式,兼容ie浏览器 const fileDownload = (fileName, params) => { showLoading();//出现load动画 Api.post(xxxfiledownloadurl, { params, responseType: 'blob', headers: { ...
  • vue+ts+elementUI:后端返回文件流,前端预览pdf文件 1.配置接口 //获取pdf文件流 export const getPdfService = (paramsData: any) => { const res: any = service.post('/idsapi/api/dispatch/dispatch_file_...
  • vue项目中,后端返回文件流,axios发送post请求下载文件 axios拦截处理 复制代码 service.interceptors.response.use( response => { // 导出 const headers = response.headers if (headers[‘content-type’] =...
  • vue+ts+elementUI:后端返回文件流,前端下载pdf文件到本地 1.配置接口 //下载天气信息pdf export const downWeatherPdfService = (paramsData: any) => { const res: any = service.post('/weaapi/api/dispatch/...
  • 下载excel 文件流下载
  • a 文件下载 后端返回文件流格式

    千次阅读 2019-02-21 11:49:56
    文件流转换 window.URL.createObjectURL(response) if(this.exportExcelLoading==false){ this.exportExcelLoading=true //避免重复请求的标识 $xh.http({ type: &quot;get&quot;, //后端协商请求方式 ...
  • js post下载文件 后端返回文件流

    千次阅读 2019-02-19 16:56:00
    // 导出excel handleExport = () => { const data = { ...this.state }; data.keyword = this.keyword; Post({ url: "/projectInfo/exportProjectInfoList", data: data, type: "upload", responseType: ...
  • 后端代码响应头部需要设置Access-Control-Expose-Headers头部信息,把你需要获取的头部属性字段设置在这个值里面前端响应部分就可以获取,否则不可无法获取(多个用逗号分割),如下设置前端可以获取文件名字, ...
  • 导出功能后端直接返回文件流,需要前端下载到本地。 首先尝试了blob方法转换文件流的本地地址,使用a标签下载 ActivityService.activityExport(data).then(res => { // 使用blob转换文件流 var blob = new...
  • https://zhuanlan.zhihu.com/p/32909043 https://blog.csdn.net/WU5229485/article/details/85219165 export function exportExel(options: any) { fetch('/api/order/exportExcel') .then(res => res.b...
  • get请求,浏览器可以直接下载后台返回文件流,但是post请求,浏览器不会直接下载。 直接贴代码: myPlanEdit(type) { this.$http.defaults.headers.common['token'] = this.token; this.save_type = type ...
  • 最近在做项目的时候遇到Excel导出功能,后端返回的是文件流,前端如何实现下载功能,以下是项目用的源码,有需要可直接复制使用: // 导出 exporttable() { this.axios({ method: "get", url: this.baseUrls + ...
  • exportCheckBill(obj) .then(response => { // 处理请求返回文件流 const content = response; const blob = new Blob([content]); const fileName = `文件名.xlsx`; ...
  • a.click() // 点击下载 document.body.removeChild(a) // 下载完成移除元素 window.URL.revokeObjectURL(href) // 释放掉blob对象 如果说后端返回文件流和错误信息得到的blob.type都为application/json, 重点,这...
  • 实现 package main import ( "testing" ) import ( "github....) func TestCreateExcel(t *testing.T) { var user = struct { ... // 生成一个新的文件 file := xlsx.NewFile() // 添加sheet页 sheet,
  • 接口要求: post方法、入参为json格式、出参文件流 1.请求函数 exportExcel: function(form) { return axios({ // 用axios发送post请求 method: 'post', url: '/serviceTime/exportData', // 请求地址...
  • 由于后端返回的是文件流,需要前端对返回的文件流进行处理 1.先是声明发送请求的返回格式:responseType: 'blob' 自定义下载文件请求方法: /** * 封装文件下载post请求 * @param url * @param data * @...
  • 前端处理下载后端返回文件流

    千次阅读 2020-11-03 10:13:37
    后端返回文件流,前端需要对返回的文件流处理进行文件下载 先是发送请求的时候声明返回blob格式 url: '', method: 'post', data: params, responseType: 'blob' //responseType: 'ArrayBuffer' 然后将返回的数据传...
  • 前端通过传递参数,后端返回文件流,前端进行处理并进行文件下载,直接上代码。 downLoadFile(data, filename) { if (typeof window.chrome !== 'undefined') { // Chrome version var link = document....

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 62,869
精华内容 25,147
关键字:

后端返回文件流