base64-图片传输

哈罗大家好，又到了分享时间了。大家看标题就知道，但是我也只是作为一个新人的视角去认识这个base64，大概了解了一下，没有太深入，因为前段有很好的base64工具，java也有BASE64Decoder包，所以我就以一个如何使用的角度来总结一下。

说来惭愧，base64以前也听过但是没用使用过，这次小程序项目接触到的。小程序用有个电子签章需要用户签名，接着将签名后的图片发送给后台存储，

认识base64

这里引用廖雪峰老师的话：用记事本打开、、这些文件时，我们都会看到一大堆乱码，因为二进制文件包含很多无法显示和打印的字符，所以，如果要让记事本这样的文本处理软件能处理二进制数据，打包成一种安全格式，将其作为HTTP首部字段的值发送出去，而无须担心其中包含会破坏HTTP分析程序的冒 、换行符或二进制值。就需要一个二进制到字符串的转换方法。Base64是一种最常见的二进制编码方法。

浅识原理

我其实也挺好奇的这个64到底是什么意思：后来才知道原来是64个字符来表示的二进制方法，那么到底哪64个字符呢实就是：’A’,’B’,’C’,…’a’,’b’,’c’…’0′,’2′,’3′,…’+’,’/’。

下面是一个简单的base64编码实例。在这里，三个字符组成的输入值“Ow!”是base64编码的，得到的是4个字符的base64编码值“T3ch”。它是按以下方式工作的。

• (1) 字符串”Ow!”被拆分成3个8位的字节(0x4F、0x77、0x21)。

• (2) 这3个字节构成了一个24为的二进制01001111 01110111 00100001。

• (3) 这些为被划分为一些6位的序列010011、110111、011100、1000001.

• (4) 每个6位值都表示了从0～63之间的数字，对应base64字母表中的64个字符之一。得到的base64编码字符串是4个字符的字符串“T3ch”。然后就可以通过线路将这个字符串作为“安全的”8位字符传送出去，因为只用了一些移植性最好的字符(字母、数字等)。

其实大家可以注意到长度变短了是不是，可能大家并不知道这意味着什么。就像我上面说的，在传一个图片或者更大一点的文件时，二进制字串是非常长的，当这个字串作为请求参数传给后台的情况。想这种情况，参数变短变小其实还是挺不错的。但有同仁说post请求参数长度不限，话说到这个份上，我其实也没法反驳。

应用场景及使用方式

应用场景的话就是上文和大家所说的电子签名，这里着重和告诉大家我是如何使用的。

上图是我在项目上用安心签(自行百度)的插件得到的页面，当我们签完名之后，会得到一个base64字串。一般是长这个样子：

 “data：base64img,iVBORw0KGgoAAAAl…..X6Vjt3t0v7tBXAWY8fLWL1…27hj7Iz5pW53oE4zNafWXOA5ji/fufqnum53GE1M9 mi9wqi3qsEAAAAASUVORK5CYII=”。

好，我们在得到这个字串该传给后端了，后端代码呢，我借鉴了 上的文章，使用java写的，看不懂的同学拷贝就行了，不用纠结，down下来也是可以使用的。下载地址https://blog.csdn.net/Acxm7799/article/details/79701029。

注意，我的场景只是用到了generateImage方法，参数和存储路径，大家可以想我一样先写死。可能有人会问我的图片怎么得到它的base64字串呢个问题大家也不用担心，浏览器给我们提供了方便。具体方法看下图：

我们随便打开一个 页，打开开发者控制台，source里找到img，当然不是每个 站都有，但大部分都有静态图片存放在源文件当中，没有img的 站可能把访问图片作为 络资源去访问，但其实无所谓啦。好，我们看到右侧的图片没有，大大的百度。接下来我们右击图片

点击open image in new tab>再打开开发控制台，看到右面选中的字串就是base64字串。

好，扯多了，上面的java 代码文件在f盘生成的文件同样也生成了。

generateImage方法的第一个参数就是我们前端传给后台的base64字串，这样就小功告成了。

今天就和大家分享到这了，明天还要上班，大家早点休息。