前端将blob转换为可下载的url及下载

一.转换

javascript 复制代码
//将blob转换为url
const changeBlobToUrl = blobData => {
	return new Promise(resolve => {
		//创建Blob对象
		const blob = new Blob([blobData])

		// 创建FileReader对象
		const reader = new FileReader()

		reader.onload = function (e) {
			resolve(e.target.result)
		}

		// 使用FileReader读取Blob数据
		reader.readAsDataURL(blob)
	})
}

二.下载

javascript 复制代码
//前端下载blob的url类型文件
const downloadFileByBlobUrl = (url: string, name: string) => {
	aDownload(url, name)
	URL.revokeObjectURL(url)
}


const aDownload = (url, name) => {
	// 创建<a>元素
	const link = document.createElement("a")
	// 设置<a>元素的属性
	link.href = url
	link.download = name
	// 将<a>元素添加到文档中
	document.body.appendChild(link)
	// 触发点击事件
	link.click()
	// 移除<a>元素
	document.body.removeChild(link)
}
相关推荐
haluhalu.5 分钟前
深入理解 AI Agent(1.2):Harness 工程——模型之外的竞争力
前端·数据结构·人工智能·python·langchain·个人开发
data analyse 45612 分钟前
服务端统计时区切换的日期归并
大数据·前端·数据库·人工智能·数据分析
misty youth15 分钟前
前端知识速查
前端·react.js·web
乌暮28 分钟前
从 `println` 到生产级日志:Spring Boot 日志体系完全指南
java·开发语言·jvm·spring boot·后端·学习·面试
雪芽蓝域zzs36 分钟前
从零搭建【pnpm+Vue3+TS+Setup+VueRouter4+Pinia+Axios+ElementPlus (unplugin 按需)】仿若依后台
前端·vue.js
星夜离尘5642 分钟前
MATLAB 定点量化误差实验 半个 LSB 的界限为什么挡不住削顶失真
开发语言·matlab
燕落南枝43 分钟前
HTML 列表标签详解:有序列表、无序列表与描述列表
前端·html
Wang's Blog1 小时前
Java 项目实战: 交友项目 - 百度人脸识别:介绍
java·开发语言·交友
障碍的枫子1 小时前
我的第一个Agent
开发语言·python·langchain
Pniubi1 小时前
区分agent中长期记忆和偏好记忆
开发语言·ai·智能体