大家好，我是 Echa。
好久没跟粉丝们细聊JavaScript那点事了。做一名全栈工程师，JS基础还是要打牢，这样的话不管底层业务逻辑以及第三方框架怎么变化，都离不开基础。本文文章属于基础篇，阅读有点乏味枯燥，但一定能学到知识。
2024年09月16日
大家好，我是 Echa。
好久没跟粉丝们细聊JavaScript那点事了。做一名全栈工程师，JS基础还是要打牢，这样的话不管底层业务逻辑以及第三方框架怎么变化，都离不开基础。本文文章属于基础篇，阅读有点乏味枯燥，但一定能学到知识。
2024年09月16日
Blob 全称为 binary large object ，即二进制大对象，它是 JavaScript 中的一个对象，表示原始的类似文件的数据。实际上，Blob 对象是包含有只读原始数据的类文件对象。简单来说，Blob 对象就是一个不可修改的二进制文件。
2024年09月16日
它可以用于在文本协议中传输二进制数据，例如在电子邮件中传输图片或在网页中嵌入图像等。Base64编码使用64个字符集（A-Z、a-z、0-9和"+"、"/"）来表示二进制数据。
Base64编码的原理是将3个字节的二进制数据（24位）划分为4个6位的组，然后将每个6位的组转换为对应的Base64字符。如果数据的长度不是3的倍数，会进行适当的填充。
2024年09月16日
在接口或性能测试中，会碰到接口的某些参数值是base64的，那就是调接口之前，得先把图片转换成base64。
如果只是简单的场景，可以事先把转换好的base64,通过用户自定义变量写死一个。
但是复杂场景的时候，比如说很多不同大小的图片，大批量图片等，为了尽量模拟实际场景，要求每次取不同的图片，进行稳定性或性能测试。这个时候把所有图片提前转换，然后在存储，就不太方便了。
下面就来说下用前置处理器beanshell自动转换图片
2024年09月16日
首先我们观察网页图片的base64位编码
$img = 'data:image/png;base64,......';
$img0 = ' data:image/jpeg;base64,....';
2024年09月16日
图片流转base64展示
const that = this;
request({
url: 'XXXXX',
method: 'GET',
responseType: 'arraybuffer',
success: function(res) {
const base64 = wx.arrayBufferToBase64(res);
that.setData({
userImageBase64: `data:image/jpg;base64,${base64}`
});
}
}); 2024年09月16日
数据URI是以“data”方案开头的URI，允许您轻松地在网页中嵌入各种对象。
与Blob URI非常相似，数据URI已存在一段时间，并且在所有主流浏览器上都受支持。数据URI是具有以下模式的格式化字符串：
data:[media type][;base64],[data]
您可以在HTML或CSS代码中使用数据URI，无论您在何处放置文件路径。例如，您可以使用数据URI在CSS中指定背景图像：
2024年09月16日
PDF.js 支持通过 base64 数据直接加载 PDF 文件。为了实现这一功能，你需要先将 base64 编码的字符串转换为二进制数据，然后使用 PDF.js 的 API 来渲染 PDF 页面。
2024年09月16日
如果你是一个软件开发，不论前端后端工程师，图片的处理你是肯定要会的，关于图片的Base64编码，你可能有点陌生，但是这是一个软件工程师应该要掌握的知识点，现在很多网友把图片与base64转换都做成了小工具如：
http://www.yzcopen.com/img/imgbase64今天我们就一起来看一下吧。base64编码 是将数据用 64 个可打印的字符进行编码的方式，任何数据底层实现都是二进制，所以都可以进行 base64编码，base64编码 主要用在数据传输过程中（编码、解码）。而 Data URI 是将数据用 URI 的形式进行展现。常用的是将图片进行 base64 编码，用 Data URI 的形式进行展现，可以说，base64编码后的字符串是某些 Data URI（这里就包括图片的 base64 URL) 的一部分。（图片转 Base64码 之后是通过 Data URI scheme来实现显示的）