2 画布编码

canvas.toDataURL(type, encoderOptions);

参数说明：

• type，设置输出的类型，比如 image/png image/jpeg等
• encoderOptions： 0-1之间的数字，用于标识输出图片的质量，1表示无损压缩，类型为： image/jpeg 或者image/webp才起作用。

 var canvas = document.querySelectorAll("#canvas");
 var dataURL = canvas.toDataURL();
 console.log(dataURL);
    // "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNby
    // blAAAADElEQVQImWNgoBMAAABpAAFEI8ARAAAAAElFTkSuQmCC"

 var img = document.querySelector("#img-demo");//拿到图片的dom对象
 img.src = canvas.toDataURL("image/png");      //将画布的内容给图片标签显示

关于base64：

Base64 是网络上最常见的用于传输 8 Bit 字节码的编码方式之一，Base64 就是一种基于 64 个可打印字符来表示二进制数据的方法。

Base64编码是从二进制到字符的过程，可用于在 HTTP 环境下传递较长的标识信息。采用 Base64 编码具有不可读性，需要解码后才能阅读。

Base64 由于以上优点被广泛应用于计算机的各个领域，