/*** 通过图片url 获取图片file对象* @param url* @param fileName 文件名称(一定要带后缀)* @param callback 回调函数* @returns {*}*/
function getImageFileFromUrl(url, fileName,callback) {var blob = null;var xhr = new XMLHttpRequest(); xhr.open("GET", url);xhr.setRequestHeader('Accept', 'image/jpeg');xhr.responseType = "blob";xhr.onload = () => {if (xhr.status == 200) {blob = xhr.response;let imgFile = new File([blob], fileName, {type: 'image/jpeg'});callback.call(this,imgFile);}};xhr.send();
}
demo:(用的图片url是百度上随便搜的)
<!DOCTYPE html>
<html lang="en"><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"><script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
</head><body>
<img/>
</body><script>
function getImageFileFromUrl(url, imageName,callback) {// imageName一定要带上后缀var blob = null;var xhr = new XMLHttpRequest(); xhr.open("GET", url);xhr.setRequestHeader('Accept', 'image/jpeg');xhr.responseType = "blob";xhr.onload = () => {if (xhr.status == 200) {blob = xhr.response;let imgFile = new File([blob], imageName, {type: 'image/jpeg'});console.log(imgFile)callback.call(this,imgFile);}};xhr.send();
}$(function () {getImageFileFromUrl('https://dss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=4085579248,162891217&fm=15&gp=0.jpg','testFile.jpg',function(file){console.log(file)var r = new FileReader()r.readAsDataURL(file)r.onload = function (e) {var base64 = e.target.result;$("img").attr('src', base64); }});})
</script></html>