base64⽂件数据读取Base64 字符串转换PDF⽂件
先上码
const code = place(/[\n\r]/g, '') // 检查base64字符串是否符合base64编码
const raw = window.atob(code) // base64解码
const rawLength = raw.length // 获取base64解码后的⽂件流字符串
const uInt8Array = new Uint8Array(rawLength)  // 初始化⼀个Uint8Array数组
for (let i = 0; i < rawLength; ++i) { // 转换Uint8Array类型
uInt8Array[i] = raw.charCodeAt(i) // 将解码后的逐个字符转换成Unicode序号，放⼊Unit8Array数组
}
const blobItem = new Blob([uInt8Array], { type: 'application/pdf' }) // 通过Blob将Uint8Array数组转换成pdf类型的⽂件对象const blobURL = ateObjectURL(blobItem) // 将⽂件对象转换成URL链接
window.open(`pdfjs/web/viewer.html?file=${blobURL}`) // (代码在vue项⽬中)通过pdfjs插件打开转换好的URL链接
那么，开始详细拆解
知识点1. Base64 编码与解码
参考：
1. base64编码
window.btoa();
const str = "TEST";
const enc = window.btoa(str);
该⽅法使⽤ "A-Z", "a-z", "0-9", "+", "/" 和 "=" 字符来编码字符串。
2. base64解码
window.atob();
console.log(window.atob(enc)); // "TEST"
知识点2. Uint8Array 类型数组
MDN：
Uint8Array 数组类型表⽰⼀个8位⽆符号整型数组，创建时内容被初始化为0。
创建完后，可以以对象的⽅式或使⽤数组下标索引的⽅式引⽤数组中的元素。
new Uint8Array(length); // 创建初始化为0的，包含length个元素的⽆符号整型数组
知识点3. JavaScript charCodeAt( ) ⽅法
参考：
返回字符的 Unicode 编码，即 Unicode 值
const str = "HELLO WORLD";
const n = str.charCodeAt(0);
console.log(n);  // '72'
字符串转数组编码方式
知识点4. Blob 对象
MDN：
简单来说就是把⼆进制、base64等字符串转换成⽂件对象，并提供多种⽅法调⽤。
⾮常庞⼤的内容，后⾯再深挖...
知识点5. URL > createObjectURL( )
MDN：
URL 接⼝⽤于解析，构造，规范化和编码
createObjectURL( )
属静态⽅法，“返回⼀个，包含⼀个唯⼀的blob链接（该链接协议为以blob:，后跟唯⼀标识浏览器中的对象的掩码）。”
此处使⽤的是将 Blob 的⽂件对象转换成 URL
知识点6. Window.open( )
MDN：
创建⼀个新的浏览器窗⼝对象，如同使⽤⽂件菜单中的新窗⼝命令⼀样。strUrl 参数指定了该窗⼝将会打开的地址。如果strUrl 是⼀个空值，那么打开的窗⼝将会是带有默认⼯具栏的空⽩窗⼝（加载about:blank）。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。