如何在 JSON 中接收字节数组

Question

我正在尝试从服务器接收 PDF，该 PDF 将被包装在 JSON 中。

如果我只将 pdf 的字节数组发送到前端，我可以通过将 responseType 设置为 arraybuffer 来正确读取它，然后我可以通过以下方式下载 PDF：

 var blob = new Blob([data], { type: application/pdf});
    if ($window.navigator && $window.navigator.msSaveOrOpenBlob) {
        $window.navigator.msSaveOrOpenBlob(blob);
    } else {
        var a = document.createElement("a");
        document.body.appendChild(a);
        var fileURL = URL.createObjectURL(blob);
        a.href = fileURL;
        a.download = fileName;
        a.click();
    }
}

但是，当服务器尝试发送带有字节数组的 JSON 时，如果我将 responseType 设置为 JSON ，那么我将无法转换 blob。但是，如果我将 responseType 设置为 arrayBuffer ，我将得到一个 arrayBuffer 数组，如何将其转换为 JSON，同时仍然能够提取 PDF：

我收到的 JSON 格式如下：

 {
  result: true,
  value: <the pdf byte array>,
  errorMessage: null
}

原文由 user1294510 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您应该将字节转换为 base64 字符串，并在 UI 上从中读取字节。

原文由 Petr Averyanov 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

如果假定以下变量代表 responseText 的结构：

 responseText = {
      result: true,
      value: <the pdf byte array>,
      errorMessage: null
}

responseText.value 是字节数组。如果字节数组已经被键入为 Uint8Array 那么这将起作用。

（ 注意：存在其他 类型化数组，因此请选择最适合您的情况的数组）：

 var blob = new Blob([response.value], { type: 'application/pdf'});
if (window.navigator && window.navigator.msSaveOrOpenBlob) {
    window.navigator.msSaveOrOpenBlob(blob);
} else {
    var a = document.createElement("a");
    document.body.appendChild(a);
    var fileURL = URL.createObjectURL(blob);
    a.href = fileURL;
    a.download = 'test';//filename
    a.click();
}

但是，如果存在如下所示的字节字符串数组或整数数组：

responseText.value = [145, 229, 216, 110, 3]

并且需要将其转换为类型化字节数组，然后以下内容将起作用：

 var ba = new Uint8Array(responseText.value);

或者

var ba = new Uint8Array([145, 229, 216, 110, 3]);

所以，

 var blob = new Blob([ba], { type: 'application/pdf'});

通过这种方式，字节数组可用于创建 blob，因此在 click 事件触发时下载文件。

原文由 Nik B 发布，翻译遵循 CC BY-SA 4.0 许可协议