从uri获取图片文件的File对象

1. 业务场景

   1. 需求: 复制一个模块, 该模块内容含有图片文件.
   2. 可提供的数据有: 该模块的相关信息(id等), 以及图片路径.
   3. 后台提供接口中, 需要传file字段.

2. 知识储备

   1. xhr配置
   2. blob对象
   3. new File()方法

3. 函数实现

//util.js

export function getImageFileFromUrl(url, imageName) {

  // imageName一定要带上后缀
  let p = new Promise((resolve, reject) => {
    var blob = null;
    var xhr = new XMLHttpRequest(); 
    xhr.open("GET", url);
    xhr.setRequestHeader('Accept', 'image/jpeg');
    xhr.responseType = "blob";
    xhr.onload = () => {
      blob = xhr.response;
      let imgFile = new File([blob], imageName, {type: 'image/jpeg'});
      resolve(imgFile);
    };
    xhr.send();
  });
  return p;
}