图片转换为base64格式，再由base64转为文件上传

---

一、使用步骤

1.图片转为base64

代码如下（示例）：

    getBase64(img) {
      var canvas = document.createElement("canvas");
      canvas.width = img.width;
      canvas.height = img.height;
      var ctx = canvas.getContext("2d");
      ctx.drawImage(img, 0, 0, img.width, img.height);
      var dataURL = canvas.toDataURL("image/png");
      return dataURL
      // return dataURL.replace("data:image/png;base64,", "");
    },
    main() {
      let that = this
      var img = document.createElement('img');
      img.src = 'http://localhost:4000/admin/img/bg.6b0da95c.png';  //此处自己替换本地图片的地址
      img.crossOrigin = 'anonymous'
      img.onload = () => {
        // debugger
        var data = that.getBase64(img);
        var img1 = document.createElement('img');
        img1.src = data;
        document.body.appendChild(img1);
        console.log(data);
        // let data = 'image/jpeg;base64'+ idInfos[13]
        //下面就是上传图片文件
        that.file = that.base64ToBlob(data, 'shiyan.png')
        that.shangchuan()
      }
    },

2.base64上传

代码如下（示例）：

    /*将base64转换为file继承自blob*/
    base64ToBlob(dataurl, filename) {
      var arr = dataurl.split(',');
      var mime = arr[0].match(/:(.*?);/)[1];/*文件类型*/
      var bstr = atob(arr[1]);
      var n = bstr.length;
      var u8arr = new Uint8Array(n);
      while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
      }
      return new File([u8arr], filename, { type: mime });
    },
    shangchuan() {
      let that = this
      let file = that.file
      const formData = new FormData()
      let ysFile = file
      formData.append('file', ysFile)
      postAction('上传路径', formData)
        .then((res) => {
          if (res.success) {
           
          } else {
           
          }
        })
        .finally(() => {
        })
    },

---