vue.js post请求接收后台的“文件流压缩包”,触动浏览器进行下载

1. vue  采用 axios 进行post 请求。返回值类型:responseType: 'blob',格式。

import service from 'axios'

const URL_HTTP_DOWN_MORE = "http://10.99.150.50:20001/";

// 创建axios实例
const axios = service.create({
  baseURL:URL_HTTP_DOWN_MORE, // api 的 base_url
 
  timeout: 50000, // 请求超时时间
  contentType: "application/json;charset=utf-8",
  responseType: 'blob',
});
interceptors(axios);

export default axios

2.方法中引入 axios ,方法中请求后台进行下载。 

import axios from "./index.js"。
return axios({
    url: "你的请求地址",
    method: 'post',
    data: “传递参数”,
  }).then(response => { 
    console.log(response);
    let blob = new Blob([response.data], {type: 'application/zip'});
    if('download' in document.createElement('a') ){//// 非IE下载
      let a = document.createElement('a');
      a.style.display = 'none';
      a.href = window.URL.createObjectURL(blob);
      a.download = zipName;
      a.click();
      // URL.revokeObjectURL(a.href) // 释放URL 对象
      // document.body.removeChild(a);
    }else{ //IE10+
      navigator.msSaveBlob(blob, zipName)
    }

  }).catch(err => {
    console.log(err);
  })

type:类型为"application/zip",也可以是其他文件类型。 application/pdf  ,application/x-ppt,application/vnd.ms-powerpoint,audio/vnd.rn-realaudio 音频 ,'application/vnd.ms-excel' 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章