敞开成长之旅！这是我参与「日新计划 12 月更文挑战」的第1天，点击查看活动详情
早上好正午好下午好晚上好! 欢迎来到Morakes频道
本文将带你探究Base64编码的原理
把图片丢进浏览器，翻开sources能看到一长串字符串，这是图片的Base64编码。这一长串编码到底是怎样生成的呢？ 咱们接下来探究一下base64编码的原理
Base64 称号的由来
Base64编码要求把3个8位的字节（3*8=24）转化为4个6位的字节（4*6=24），之后在6位的前面补两个0，形成8位一个字节的方式。 假如剩余的字符缺乏3个字节，则用0填充，输出字符使用’=’，因而编码后输出的文本末尾可能会出现1或2个’=’。
为了确保所输出的编码位可读字符，Base64制定了一个编码表，以便进行统一转化。编码表的巨细为2^6=64，这也是Base64称号的由来。(下面是Base64编码表)
思路
原始数据对应ASCII，生成8位的二进制，3个8位的字节（3*8=24）转化为4个6位的字节（4*6=24），不够补零。分割之后，得出来6位字节的二进制转化成十进制，再从base64表中寻觅对应的字符
graph TD
原始数据 --> 每个字符依照ASCII编码生成3个8位的二进制 --> 3个8位的字节分割为4个6位字节 --> 再转化成十进制生成Base64编码
实现进程
原始数据：Mz1
依据ASCII表转化成8位二进制：01001101 | 01111010 | 00110001
将 3*8 切割成 4*6：010011 | 010111 | 101000 | 110001
分别转化成十进制：19 | 23 | 40 | 49
最后再去Base64编码表中找到数字对应的字符：T | X | o | x
最终 Mz1 的 Base64 ：TXox
强化训练
Q：写出TB对应的Base64编码
1.TB 对应的ASCII
T：01010100 B：01000010
2.将三个8位的二进制分割成4个6位的二进制
3.将二进制转化成十进制
4.将十进制依照Base64表得到Base64编码
A：TB所对应的Base64编码为 VEI=
用Base64的来出现图片的有什么优势呢？
- 削减http网络恳求：网页上的图片资源假如选用http方式的url的话都会额定发送一次恳求，网页发送的http恳求次数越多，会形成页面加载速度越慢。而选用Base64格局的编码，将图片转化为字符串后，图片文件会随着html元素一并加载，这样就可以削减http恳求的次数，关于网页优化是一种比较好的手段。
- 不会形成跨域恳求的问题。
- 没有图片更新要从头上传，不会形成整理图片缓存的问题
缺乏之处就在于增加了CSS文件的尺度，形成数据库数据量的增大，IE6 IE7并不支持
对你有帮助的话，就点个赞吧！
