doracoin / blobdownload.js

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) { // 创建一个<a>元素 var link = document.createElement("a"); link.href = blobUrl; // 重要：链接有 download 属性，浏览器才会触发保存文件的动作，否则还是新标签页打开预览 link.download = saveName; // 指定下载的文件名 // 将<a>元素添加到DOM中（不显示） document.body.appendChild(link); // 触发点击事件 link.click(); // 移除<a>元素 document.body.removeChild(link); }