1、<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
2、<body>
<!--<input id="input" onchange="change()" type="file"></input>-->
<img id="img" src="img/1.png
<output id="result"></output>
</body>
3、</html>
<script>
var img = document.getElementById("img");
var result1 = document.getElementById("result");
window.onload = function() {
4、load();
}
function load(){
loadImageToBlob(img.src, function(blobFile) {//这里的img.src改地址
if(!blobFile) return false;
// var fileReader = new FileReader();
5、//
// fileReader.readAsDataURL(blobFile);
//
// fileReader.onload = function() {
//
// console.log(this.result);//这里输出的数据放到url里能生成图片
//
// };
6、result1.innerHTML = '<a download href="' + window.URL.createObjectURL(blobFile) + '" target="_blank">文件下载</a>';
});
}
var loadImageToBlob = function(url, callback) {
7、if(!url || !callback) return false;
var xhr = new XMLHttpRequest();
xhr.open('get', url, true);
xhr.responseType = 'blob';
xhr.onload = function() {
8、// 注意这里的this.response 是一个blob对象 就是文件对象
callback(this.status == 200 ? this.response : false);
}
xhr.send();
return true;
}
</script>
