blob对象实现文件下载

<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title></title>
</head>
<body>
	
</body>
<script>
	function download(url){
		const xhr = new XMLHttpRequest();
		xhr.open('GET', url);
		xhr.responseType = "blob";
		xhr.send();
		xhr.onload = function(){
			const fileBolb = xhr.response;
			console.log(fileBolb);
			// 将blob转成url地址
			const fileUrl = URL.createObjectURL(fileBolb);
			console.log(fileUrl);
			// document.querySelector('img').setAttribute('src', fileUrl);
			const elementA = document.createElement('a');
			elementA.setAttribute('href', fileUrl);
			elementA.setAttribute('download', '');
			elementA.click()
		}
	}
	let imgUrl = 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg3.yimasm.com%2Fpic%2F2021%2F02%2F26%2F3990bc7af116e15967ac2ee1a315ee43.jpg&refer=http%3A%2F%2Fimg3.yimasm.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1643118831&t=938a79aea1136e4fca446f7701d6a12a';
	download(imgUrl);
</script>
</html>

  

posted @ 2021-12-26 22:00  秋墨江雪  阅读(96)  评论(0编辑  收藏  举报