> 文档中心 > js 通过图片URL地址将图片转为可操作的File文件对象

js 通过图片URL地址将图片转为可操作的File文件对象

使用原生XMLHttpRequest发送请求
1、创建XMLHttpRequest对象
2、设置调用方式为GET
3、设置请求头参数:主要设置文件类型
4、设置响应类型:responseType为“blob”
5、调用
关键代码

/** * 根据图片url转为png文件对象 * @param url * @param imageName * @returns {Promise} */function getImageFileFromUrl(url, imageName) {    return new Promise((resolve, reject) => { var blob = null; var xhr = new XMLHttpRequest(); xhr.open("GET", url); xhr.setRequestHeader('Accept', 'image/png'); xhr.responseType = "blob"; // 加载时处理 xhr.onload = () => { // 获取返回结果     blob = xhr.response;     let imgFile = new File([blob], imageName, { type: 'image/png' });     // 返回结果     resolve(imgFile); }; xhr.onerror = (e) => {     reject(e) }; // 发送 xhr.send();    });}

调用方式

let imageFile = nullgetImageFileFromUrl(imageUrl,"fileName").then((response)=>{// 返回的是文件对象,使用变量接收即可 imageFile  = response    })    .catch((e)=>{console.error(e))

51银饰网