javascript - 将图像转化为Base64字符串的原理或者过程是什么

Question

今天看了Base64编码的原理，想试着用Javascript去实现图像到Base64字符串的编码，而且不用canvas.toDataURL()函数，不用fileReader，而只是用canvas获取图像的rgba数据之后自己对数据进行编码处理，但是今天试了两种方法之后都失败了。下面是我对数据处理的两种方式：

1. 将用canvas获取的rgba数组每一个值都转化为8为二进制，然后连接成二进制字符串，然后将这个字符串转化为Base64字符串；

2. 将用canvas获取的rgba数组二值化，也就是值大于127的，二进制字符串加'1'd，小于127的，二进制字符串加'0'，将这样得到的字符串转化为Base64字符串；

两种方式试过之后，都是失败的。

希望大神能指点我一下，图片转化为Base64字符串是一个怎么样的过程，谢谢！

Answer 1

canvas.toDataURL() 首先把图像转成 PNG 数据，然后再把得到的二进制的 PNG 数据转成纯 ASCII 的 base64 编码的字符串。

你要用 JavaScript 写一个 PNG 编码库么？