input上传图片

1、上传文件

现在上传图片，基本采用的是上传file formData方式。一般上传blob对象和file对象都是可以的，但是有些后台只能是 file对象方式，这个时候需要把blob对象转化为file对象方式。

let file = document.getElementById("input").files[0];   //选择的图片文件
let data = new FormData();
data.append('file', file);
//然后直接把data对象传上去，一般post方法，data就是数据

2、把file对象/blob对象 转化为base64，可以预览

let file = document.getElementById("input").files[0];   //选择的图片文件
var reader = new FileReader();
reader.readAsDataURL(file);         //读取图片文件
reader.onload = function(){
      console.log(this.result);    //this.result就是 图片base64数据
}

3、blob对象转化为file对象

file对象 是blob对象 的一种特例，一般剪裁图片插件都可以获取图片的 base64 数据，blob对象。

//base64可以转化为blob，
//blob可以转化为file对象
//file对象也可以转化为blob

//我这里只用到了 blob 转file

//这里的data参数就是blob对象
let myfile = new File([data], "filename.png", {type: "image/png"});   //blob 对象转化为file对象