将图片url转化为base64文件和file类型文件

1、将图片url转化为base64文件和file类型文件

	//图转base64
  function getBase64Image(img) {
      var canvas = document.createElement("canvas");
      canvas.width = img.width;
      canvas.height = img.height;
      var ctx = canvas.getContext("2d");
      console.log(img,canvas)
      ctx.drawImage(img, 0, 0, img.width, img.height);
      var ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase();
      var dataURL = canvas.toDataURL("image/"+ext);
      return dataURL;
   }

  //base64转file
 function dataURLtoFile(dataurl, filename) {
     var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
          bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
      while(n--){
          u8arr[n] = bstr.charCodeAt(n);
      }
      return new File([u8arr], filename, {type:mime});
  }

  var img = new Image();
  img.setAttribute("crossOrigin",'Anonymous'); //设置图片跨域防止canvas生成内容时报错
  img.onload = function(e) {
      var dataBase64 =  getBase64Image(img);  //转化为base64格式
      var file =  dataURLtoFile(dataBase64, 'avatar'); //转化为file类型文件
      console.log(file);
  }
  img.src = '{$你的图片地址}'; //例如https://www.baidu.com/img.jpg

1、主要利用canvas生成base64格式文件，再利用文件转化函数将它转化成file。
2、各网站各博主有不同的实现函数，大致方法相同。
3、两个函数都可以单独拿出来使用。
4、 img.setAttribute(“crossOrigin”,‘Anonymous’); 这一步很有必要是因为有些函数不在本网站的域名下。不加的话跨域图片canvas生成base64会报错。
canvas.toDataURL(“image/”+ext);
报错：
Uncaught DOMException: Failed to execute ‘toDataURL’ on ‘HTMLCanvasElement’: Tainted canvases may not be exported.