Base64 表示 PDF 到 blob - JavaScript

Question

我有一个表示 PDF 文件的 Base64 字符串。 我想使用 javascript 将其转换为带有 Blob 对象的文件。 完成后，我想使用 FileSaver.js 将 blob 保存为 PDF 文件。

这是我的代码：

var base64PDF = JVBERi0xLjQNCiW0t..; // This is a huge string.
var blob = new Blob([base64PDF], { type: 'application/pdf' });
saveAs(blob, "test.pdf");

此代码不起作用。它保存了一个 test.pdf，它说它无法打开这个 pdf，因为解码时出错。

我也尝试过这样做：

var base64PDF = JVBERi0xLjQNCiW0t..; // This is a huge string.
var decode = atob(screen.prp_wcfria_ExternalFile.pdfFile);
var blob = new Blob([decode], { type: 'application/pdf' });
saveAs(blob, "test.pdf");

此代码也不起作用。我该怎么做？

Answer 1

const b64toUrl = async (base64Data) => {
  const r = await fetch(base64Data);
  const blob = await r.blob();
  return URL.createObjectURL(blob);
}

base64Data 字符串应包含“data:application/pdf;base64,....”部分。

Answer 2

此 javascript 将 base64 字符串转换为 blob 对象：

// base64 string
var base64str = result.pdf;

// decode base64 string, remove space for IE compatibility
var binary = atob(base64str.replace(/\s/g, ''));
var len = binary.length;
var buffer = new ArrayBuffer(len);
var view = new Uint8Array(buffer);
for (var i = 0; i < len; i++) {
    view[i] = binary.charCodeAt(i);
}

// create the blob object with content-type "application/pdf"               
var blob = new Blob( [view], { type: "application/pdf" });
var url = URL.createObjectURL(blob);

Answer 3

您必须将 base64 字符串转换回原始二进制数据。使用 atob 是不够的，您必须通过循环运行它并将其转换为数组缓冲区 - Convert base64 string to ArrayBuffer
然后使用它来创建 blob。