不同格式的在线资源下载方法

仅供参考，不保证有效

图片

// 图片下载
export const downloadIamge = (imgsrc, name) => {
  //下载图片地址和图片名
  let image = new Image();
  // 解决跨域 Canvas 污染问题
  image.setAttribute('crossOrigin', 'anonymous');
  image.onload = function () {
      let canvas = document.createElement('canvas');
      canvas.width = image.width;
      canvas.height = image.height;
      let context = canvas.getContext('2d');
      context.drawImage(image, 0, 0, image.width, image.height);
      let _dataURL = canvas.toDataURL('image/png'); //得到图片的base64编码数据

      let blob_ = dataURLtoBlob(_dataURL); // 用到Blob是因为图片文件过大时，在一部风浏览器上会下载失败，而Blob就不会

      let url = {
          name: name , // 图片名称不需要加.png后缀名
          // name: name || "图片.png", // 图片名称不需要加.png后缀名
          src: blob_
      };
      if (window.navigator.msSaveOrOpenBlob) {   // if browser is IE
          navigator.msSaveBlob(url.src, url.name);//filename文件名包括扩展名，下载路径为浏览器默认路径
      } else {
          let link = document.createElement("a");
          link.setAttribute("href", window.URL.createObjectURL(url.src));
          link.setAttribute("download", url.name );
          // link.setAttribute("download", url.name + '.png');
          document.body.appendChild(link);
          link.click();
      }
  };
  image.src = imgsrc;
  function dataURLtoBlob(dataurl) {
      let arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
          bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
      while (n--) {
          u8arr[n] = bstr.charCodeAt(n);
      }
      return new Blob([u8arr], { type: mime });
  }
}

pdf以及其他类目

const fileTypeObj = {
  zip: 'application/zip',
  xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8',
  xls: 'application/vnd.ms-excel;charset=utf-8',
  doc: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document;charset=utf-8',
  docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document;charset=utf-8',
  txt: 'application/txt',
  pdf: 'application/pdf'
};

export const downloadFile = (blobData, fileName, fileType) => {
  if (blobData.type === 'application/json') {
    window.location.href = `${config.redirectHost}401`;
  } else {
    const blob = new Blob([blobData], { type: fileTypeObj[fileType] });
    const downloadElement = document.createElement('a');
    const href = window.URL.createObjectURL(blob);
    downloadElement.href = href;
    downloadElement.download = fileName + '.' + fileType; // 下载文件名称
    document.body.appendChild(downloadElement);
    downloadElement.click();
    document.body.removeChild(downloadElement); // 下载完成移除元素
    window.URL.revokeObjectURL(href); // 释放掉blob对象
  }
};

export const downloadFilePdf = (blobData, fileName, fileType) => {
  if (blobData.type === 'application/json') {
    window.location.href = `${config.redirectHost}401`;
  } else {
    const blob = new Blob([blobData], { type: fileTypeObj[fileType] });
    const downloadElement = document.createElement('a');
    const href = window.URL.createObjectURL(blob);
    downloadElement.href = href;
    downloadElement.download = fileName; // 下载文件名称
    document.body.appendChild(downloadElement);
    downloadElement.click();
    document.body.removeChild(downloadElement); // 下载完成移除元素
    window.URL.revokeObjectURL(href); // 释放掉blob对象
  }
};

// 创建a标签实现下载
export const downloadExcel = (blobData, fileName) => {
  if (blobData.size < 2000) {
    return;
  }
  if (blobData.type === 'application/json') {
    window.location.href = `${config.redirectHost}401`;
  } else {
    const blob = new Blob([blobData], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8' });
    const downloadElement = document.createElement('a');
    const href = window.URL.createObjectURL(blob);
    downloadElement.href = href;
    downloadElement.download = fileName + '.xlsx'; // 下载文件名称
    document.body.appendChild(downloadElement);
    downloadElement.click();
    document.body.removeChild(downloadElement); // 下载完成移除元素
    window.URL.revokeObjectURL(href); // 释放掉blob对象
  }
};

// 创建a标签实现下载
export const downloadExcelXLS = (blobData, fileName) => {
  if (blobData.size < 2000) {
    return;
  }
  if (blobData.type === 'application/json') {
    window.location.href = `${config.redirectHost}401`;
  } else {
    const blob = new Blob([blobData], { type: 'application/vnd.ms-excel;charset=utf-8' });
    const downloadElement = document.createElement('a');
    const href = window.URL.createObjectURL(blob);
    downloadElement.href = href;
    downloadElement.download = fileName + '.xls'; // 下载文件名称
    document.body.appendChild(downloadElement);
    downloadElement.click();
    document.body.removeChild(downloadElement); // 下载完成移除元素
    window.URL.revokeObjectURL(href); // 释放掉blob对象
  }
};