base64解析图片

什么是base64编码?

我不是来讲概念的，直接切入正题，图片的base64编码就是可以将一副图片数据编码成一串字符串，使用该字符串代替图像地址。

这样做有什么意义呢？

我们正常所看到的网页上的图片，都是需要消耗一个http请求下载而来（所以才有了csssprites（雪碧图）技术的应运而生，但是csssprites有自身的局限性，下文会提到）。

没错，不管如何，图片的下载始终都要向服务器发出请求，要是图片的下载不用向服务器发出请求，而可以随着 HTML 的下载同时下载到本地那就太好了，而base64正好能解决这个问题。

方法怎么用？

1.假定图片的格式是png,那么后面的代码是data:image/png;base64,这样写，注意：【后面有一个逗号】，一般我们接口请求来的 base64码如下图所示：

image.png

2.CSS中使用：

backgroundimage:url("data:image/png;base64, +这里就是获取到的base64一大串的字符串+");

3.HTML中使用：

<img src="data:image/png;base64,+这里就是获取到的base64一大串的字符串+" />