js图片上传且转化为base64

在前端实现图片上传到服务器的需求中，我们有时会把图片转化为base64的形式再上传给后台处理。

我们可以选择自己造一个轮子，或者直接找一个现有的插件。

我最近使用的是webuploader，由于没有找到如何获取未压缩图片的base64码，就手动转化了。

那我们获取file对象时，用插件的话要注意寻找有blob原型的对象。

当我们拿到file对象后，就进行转换。有两种方法，一种是使用原生对象FileReader：

  let fileReader = new FileReader();
  fileReader.onloadend = function (e) {
    let base64 = e.target.result;    // 这里的base64就是我们所要的
  };
  fileReader.readAsDataURL(blob);     // blob 即我们之前获取到的blob对象

还有第二种方法，使用canvas绘画出图片然后再用该对象的接口转化：

  首先先用canvas绘画好2d图像，记得设置宽高，当设置好了之后加上一句

var dataURL = canvas.toDataURL();    // 此处dataURL即base64