最近在做图片上传预览的组件，需求要加一个点击按钮（icon）可以下载图片的功能。

图片格式为base64，基本功能是能够下载。

图片实例

data:image/png;base64,iVBO...

base64的图片会有前缀指明图片的类型，如上图的png。我们可以使用a标签来进行下载，如下：

  <a href={base64Img} />

最简单的方法存在问题就是，当我们点击的时候，会将当前页面替换为base64的信息：

我们需要点击这个a标签可以直接进行下载，于是搜索网上的资料找到了一个方法https://stackoverflow.com/questions/14011021/how-to-download-a-base64-encoded-image

‘data:application/octet-stream;base64,‘ + img;

这个方案就是加图片的前缀改成“application/octet-stream”，这样是可以进行下载了。

但是另外的一个问题来了，就是这种方式的下载图片没有后缀。

遇到问题上网搜是个好习惯，基本上我们能遇到的问题，别人都已经遇到过了。那么继续来个帖子：https://stackoverflow.com/questions/7034754/how-to-set-a-file-name-using-window-open

这里介绍了一个html5的属性，给a标签加一个download而不进行前缀的替换。

<a href={base64Img} download />

Nice了一阵子，后来测试说，有些浏览器下载的图片没有名字，仔细阅读上面的帖子，发现download可以附一个名字：

<a href={base64Img} download="ddd.png" />

这样下载的时候就有名字了。