[JavaScript]base64和Canvas的互转/图片base64上传

后端JSON返回的为

data:image/jpeg;base64,/9j/........

Base64 ->Canvas

首先页面需要有容器

// or u can have a loop like ngfor or v-for:
                <canvas id="{
  {item.Id}}"></canvas>

  setCanvasFun(id, scr) {
    const canvas = <HTMLCanvasElement>document.getElementById(id);
    const img = new Image();
    img.src = scr;
    const myctx = canvas.getContext('2d');
    img.onload = () => {
      myctx.drawImage(img, 0, 0, 300, 150);
    };

  }

Canvas 转64

 setlogo() {
    const dom_pre = document.getElementById('template-preview');
    const canvas = dom_pre.getElementsByTagName('canvas')[0];
    const img = new Image();
    const cur = this;
    img.src = canvas.toDataURL('image/jpeg', 0.8);
    img.onload = () => {
      const mycanvas = <HTMLCan