后端返回:文件地址;流文件;File实例,前端如何下载

  1. 后端返回的是文件:地址
//href:文件地址  download:下载后保存的名称(必须要)

<a href={'http://192.168.40.237:8080/1.crt'} download='a.crt'>11111</a>
  1. 后端返回的是:流文件
//data是流文件,Content-Disposition是返回头里的文件名称,type为当前下载文件的类型
	const blob = new Blob([data], {type: 'text/html'});  
	let blobUrl = window.URL.createObjectURL(blob);
      const a = document.createElement('a');
      a.style.display = 'none';
      let temp = response.headers.get('Content-Disposition').split(';')[1].split('=')[1] || '';
      let fileDefaultName = decodeURI(temp);
      let pathname = '表格';
      a.download = fileDefaultName || pathname + '.xls';
      a.href = blobUrl;
      a.click();
      a.remove();
  1. 后端返回的是:File实例
// file是File实例

// 创建一个 URL 对象用于下载
const url = window.URL.createObjectURL(file);

// 创建一个 <a> 元素用于触发下载
const a = document.createElement('a');
a.href = url;
a.download = file.name; // 使用文件的原始名称作为下载的文件名
document.body.appendChild(a);
a.click();
a.remove(); // 立即移除 <a> 元素

// 释放创建的 URL 对象
window.URL.revokeObjectURL(url);

猜你喜欢

转载自blog.csdn.net/weixin_43925630/article/details/141860504