FileReader - Web API 接口参考 | MDN
readAsDataURL方法
读取指定的BIob或File对象。读取操作完成的时候,readyState会变成已完成DONE,并触发loadend事件,同时result属性将包含一个data:URL格式的字符串(base64编码)以表示所读取文件的内容。
readAsDataURL(blob)
//参数blob即将被读取的Blob或File对象
使用案例:
let url = 'api/xinjiang/bca6588cf7f285c1e822a1f2267eeb3a.jpg@!348x243'
function imgToBase64(imgUrl){
var xhr = new XMLHttpRequest()
xhr.open('get',imgUrl,true)
xhr.responseType="blob"
xhr.onload = function(){
if(this.status == 200){
//得到一个Blob对象
let response = this.response
//FileReader对象用于读取文件,即把文件内容读入内存。它的参数是File对象或Blob对象。
let oFileReader = new FileReader()
oFileReader.onloadend = function(e){
img.value = e.target.result
}
//readAsDataURL方法返回一个data URL,它的作用基本上是将文件数据进行Base64编码。你可以将返回值设为图像的src属性
oFileReader.readAsDataURL(response);
}
}
xhr.send()
}
imgToBase64(url)