前言
Base64是一种二进制到文本的编码方式。如果要更具体一点的话，可以认为它是一种将 byte数组编码为字符串的方法，而且编码出的字符串只包含ASCII基础字符。
例如字符串ShuSheng007对应的Base64为U2h1U2hlbmcwMDc=。其中那个=比较特殊，是填充符，一会再说。
值得注意的是Base64不是加密算法，其仅仅是一种编码方式，算法也是公开的，所以不能依赖它进行加密。
一、为什么叫Base64？
因为它是基于(Base)64个字符的一种编码方式。使用其编码后的文本只包含64个ASCII码字符（偶尔加一个填充字符=），如下所示：
Base64使用到的64个字符：
A-Z26个a-z26个0-910个+1个/1个
二、解密
1.文件
代码如下（示例）：
var url = "data:text/plain;charset=utf-8;base64," + res.data.data;
var a = document.createElement("a");
a.href = url;
a.download = `${list[0].sendNo}.txt`;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
这段代码是用来创建一个下载链接，让用户可以下载一个文本文件。
解释：
1. `var url = "data:text/plain;charset=utf-8;base64," + res.data.data;`：这一行代码创建了一个包含文本数据的 Base64 编码的数据 URL。这个 URL 的类型是纯文本 (`text/plain`)，字符编码是 UTF-8。`res.data.data` 可能是从某个地方获取的文本数据。
2. `var a = document.createElement("a");`：这一行代码创建了一个 `<a>` 元素，即超链接元素。
3. `a.href = url;`：这一行代码将刚刚创建的超链接的 `href` 属性设置为之前生成的包含文本数据的数据 URL。
4. `a.download = `${list[0].sendNo}-批次码.txt`;`：这一行代码设置了下载属性，指定了用户下载文件时默认的文件名。`${list[0].sendNo}` 可能是从 `list` 数组中获取的某个值。
5. `document.body.appendChild(a);`：这一行代码将刚刚创建的 `<a>` 元素添加到文档的 `<body>` 元素中。
6. `a.click();`：这一行代码模拟用户点击这个超链接，从而触发文件下载。
7. `document.body.removeChild(a);`：这一行代码在文件下载完成后，从文档中移除这个 `<a>` 元素。
总的来说，这段代码的作用是在页面上动态生成一个下载链接，让用户点击后可以下载一个文本文件。
2.图片
代码如下（示例）：
<img
style="width: 100%; height: 100%"
v-for="(item, index) in imgList"
:key="index"
:src="'data:image/png;base64,' + item"
alt=""
/>
这段代码是用来在页面上展示一组 Base64 编码的 PNG 图片。
解释：
1. `<img>`：这是 HTML 中用来显示图片的标签。
2. `style="width: 100%; height: 100%"`：这段代码设置了图片的宽度和高度都为父元素的 100%，即图片会填充父元素的宽度和高度。
3. `v-for="(item, index) in imgList" :key="index"`：这段代码使用 Vue.js 中的 `v-for` 指令，遍历 `imgList` 数组中的每个元素，将每个元素赋值给 `item`，并使用 `index` 作为唯一的 key。
4. `:src="'data:image/png;base64,' + item"`：这段代码动态设置了每个 `<img>` 标签的 `src` 属性，将 Base64 编码的图片数据添加到 `data:image/png;base64,` 的前缀后面。这样浏览器就可以直接解析这段 Base64 编码的数据并显示图片。
5. `alt=""`：这是图片的替代文本，当图片无法显示时会显示这段文本。
总的来说，这段代码会根据 `imgList` 数组中的每个 Base64 编码的 PNG 图片数据，动态生成对应的 `<img>` 标签，并在页面上展示这些图片。
总结
js
- const encodedData = btoa("Hello, world"); // 加密
- const decodedData = atob(encodedData); // 解密
文件： "data:text/plain;charset=utf-8;base64,"
图片： "'data:image/png;base64,'
3845
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
