import axios from "axios"; /** * 使用Blob下载图片、pdf等可被浏览器预览的文件格式 * @param fileUrl 文件链接 * @param fileSaveName 文件保存名称 */ function downFile(fileUrl, fileSaveName) { console.log("下载", fileUrl); // 发送GET请求,将响应类型设置为blob axios .get(fileUrl, { responseType: "blob" // 重要,这告诉axios返回的数据类型为Blob }) .then(response => { // response.data 是一个Blob对象,包含了文件的二进制数据 console.log("response", response); const blob = response.data; // 如果你需要使用这个Blob对象,比如将其转换为URL,可以这样做: const fileBlobUrl = window.URL.createObjectURL(blob); console.log(fileBlobUrl); downloadImage(fileBlobUrl, fileSaveName); // 这里你可以使用imageUrl,例如设置为img标签的src属性来显示图片 }) .catch(error => { // 处理错误情况 console.error("转换图片URL到Blob时出错:", error); }); } function downloadImage(blobUrl, saveName) { // 创建一个元素 var link = document.createElement("a"); link.href = blobUrl; // 重要:链接有 download 属性,浏览器才会触发保存文件的动作,否则还是新标签页打开预览 link.download = saveName; // 指定下载的文件名 // 将元素添加到DOM中(不显示) document.body.appendChild(link); // 触发点击事件 link.click(); // 移除元素 document.body.removeChild(link); }