下载的核心方法
export const contextPath = process.env.NODE_ENV === 'production' ? '/portal' : ''; //'/portal' 对应后台的 springboot 的contextPath
import { contextPath } from '../../../custom/contants.js';
downLoad =(fileKey,fileName)=>{
const params = {fileKey : fileKey};
const downloadUrl = contextPath+'/api/regulated/info/file/downLoad';
fetch(downloadUrl, {
method: 'POST',
body: window.JSON.stringify(params),
credentials: 'include',
headers: new Headers({
'Content-Type': 'application/json'
})
}).then((response) => {
response.blob().then(blob => {
const aLink = document.createElement('a');
document.body.appendChild(aLink);
aLink.style.display='none';
const objectUrl = window.URL.createObjectURL(blob);
aLink.href = objectUrl;
aLink.download = fileName;
aLink.click();
document.body.removeChild(aLink);
});
}).catch((error) => {
console.log(error);
});
};
<a onClick={()=>this.downLoad(item.fileKey,item.fileName)}>下载</a>
参考文档:React使用Post方式从服务器下载文件
react文件下载以及a.download下载的坑
React中使用fetch实现文件上传下载(https://blog.csdn.net/qq8241994/article/details/82971233)