sz-kjsxy-web/src/utils/downloadRequest.js

import axios from "axios";
import { getToken } from "@/utils/auth";
import { Loading, Message } from "element-ui";

/*
 * @params {string} url 请求拼接地址
 * @params {object} info 请求参数params或data
 */

let loading;
function customParamsSerializer(params) {
  let result = '';
  for (let key in params) {
    if (params.hasOwnProperty(key)) {
      if (Array.isArray(params[key])) {
        params[key].forEach((item,index) => {
          if(item.key){
            result += `${key}[${index}][key]=${item.key}&${key}[${index}][op]=${item.op}&${key}[${index}][value]=${item.value}&`;

          }else{
            result +=`${key}[${index}]=${item}&`
          }
        });
      }else if(  typeof params[key] === 'object' ){
        for(var k in params[key]){
          result +=`${key}[${k}]=${params[key][k]}&`
        }
      } else {
        result += `${key}=${params[key]}&`;
      }
    }
  }

  // result += 'token='+getToken()
    console.log("result",result, result.slice(0, -1))
  return result.slice(0, -1);
}

export async function download(url, method = "get", info, filename) {
  loading = Loading.service({
    lock: true,
    background: "rgba(0,0,0,0.4)",
    text: "文件正在生成中...",
  });

  let options = {
    baseURL: process.env.VUE_APP_BASE_API,
    url,
    method,
    responseType: "blob",
    timeout: 10000,
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json; charset=utf-8",
      withCredentials: true,
      Authorization: "Bearer " + getToken(),
    },
  };
  if (method === "get") {
    // options.url = url+'?'+customParamsSerializer(info)
    Object.defineProperty(options, "params", {
      value: info,
      enumerable: true,
      writable: false,
    });
  }
  if (method === "post") {
    Object.defineProperty(options, "data", {
      value: info,
      enumerable: true,
      writable: false,
    });
  }

  try {
    if(options.method==='get'){
      options.paramsSerializer = customParamsSerializer
    }
  console.log("options",options)
    const response = await axios.request(options);

    loading.close();

    // 提取文件名
    if (!filename) {
      filename =
        response.headers["content-disposition"]?.match(/filename=(.*)/)[1] ||
        "";
    }

    // 将二进制流转为blob
    const blob = new Blob([response.data], {
      type: "application/octet-stream",
    });
    if (typeof window.navigator.msSaveBlob !== "undefined") {
      // 兼容IE，window.navigator.msSaveBlob：以本地方式保存文件
      window.navigator.msSaveBlob(blob, decodeURI(filename));
    } else {
      // 创建新的URL并指向File对象或者Blob对象的地址
      const blobURL = window.URL.createObjectURL(blob);
      // 创建a标签，用于跳转至下载链接
      const tempLink = document.createElement("a");
      tempLink.style.display = "none";
      tempLink.href = blobURL;
      tempLink.setAttribute("download", decodeURI(filename));
      // 兼容：某些浏览器不支持HTML5的download属性
      if (typeof tempLink.download === "undefined") {
        tempLink.setAttribute("target", "_blank");
      }
      // 挂载a标签
      document.body.appendChild(tempLink);
      tempLink.click();
      document.body.removeChild(tempLink);
      // 释放blob URL地址
      window.URL.revokeObjectURL(blobURL);
    }
  } catch (err) {
    console.error(err);
    loading.close();
    Message({
      type: "error",
      message: err,
    });
  }
}