Vue 下载文件流,重命名 无法获取 "Content-Disposition"
//这句要加,否则前端获取不到 "Content-Disposition"
response.setHeader("Access-Control-Expose-Headers", "Content-Disposition");
response.setHeader("Content-Disposition", "attachment; filename=" + downloadName);
Vue
downloadLog(queryParams: CustodyPageQuery) {
return request({
url: `/logger/download`,
method: "post",
data: queryParams,
responseType: "blob",
});
},
//下载APP日志
const onAppLoggerDownLoad = async (row: OrderVO) => {
queryParams.PhoneNo = row.MemberPhoneNo;
queryParams.StartTime = row.StartTime;
queryParams.EndTime = row.EndTime;
CustodyOrderAPI.downloadLog(queryParams).then((response: any) => {
console.log("response", response.headers);
const fileData = response.data;
// content-disposition 要小写
const fileName = decodeURI(response.headers["content-disposition"].split(";")[1].split("=")[1]);
const fileType = "application/octet-stream;charset=utf-8";
const blob = new Blob([fileData], { type: fileType });
const downloadUrl = window.URL.createObjectURL(blob);
const downloadLink = document.createElement("a");
downloadLink.href = downloadUrl;
downloadLink.download = fileName;
document.body.appendChild(downloadLink);
downloadLink.click();
document.body.removeChild(downloadLink);
window.URL.revokeObjectURL(downloadUrl);
});
};
本文来自博客园,作者:VipSoft 转载请注明原文链接:https://www.cnblogs.com/vipsoft/p/19073624
浙公网安备 33010602011771号