将内容类型 'application/java-archive' 的数据转换为 Blob 对象

Question

我有一个 GET 请求返回一个 JAR 文件，我需要下载该文件。 下载部分的最简单方法是让浏览器按如下方式处理下载部分：

window.location.href = URL

但是，这不适用于错误处理(处理服务器错误(。

或者，我找到了另一种创建 blob 对象的方法，并从该对象创建对象 URL 并将其分配给锚标记以供下载 -

callSomeURL().then((res) => {
const blob = new Blob([res._body], { type: res.headers.get('content-type') 
});
const url = window.URL.createObjectURL(blob);
const linkElement = document.createElement('a');
linkElement.setAttribute('href', url);
linkElement.setAttribute('download', 'test jar file');
const clickEvent = new MouseEvent('click', {view: window});
linkElement.dispatchEvent(clickEvent);
}).catch((error) => error handling part)

内容类型为"应用程序/Java 存档" res._body是编码字符串。

问题是下载的文件无效/损坏。(不确定实现有什么问题(。

我这里有 2 个问题 -

1. 创建 Blob 对象的正确方法是什么？它是使用响应返回的编码数据还是请求的 URL 创建的？
2. 使用错误处理处理文件下载的正确方法是什么？

Answer 1

您的问题是您得到的响应是纯文本/文本。 因此，当你生成 Blob 时，它仍然是纯文本，并且二进制数据在通过 javascript 转换为 utf16 时被破坏。

为了避免这种情况，可以直接从 ajax 调用中将其作为 blob 请求。

使用 XMLHttpRequest，您可以设置 XHR 对象的responseType参数：

var xhr = new XMLHttpRequest();
xhr.open('get', your_url);
xhr.responseType = 'blob';
xhr.onload = function() {
var blob = xhr.response;
// do something with the blob
var url = URL.createObjectURL(blob);
anchor.href = url
anchor.click();
};
xhr.send();

使用 fetch API，您可以调用响应对象的blob()方法

fetch(your_url)
.then(resp => resp.blob())
.then(doSomethingWithBlob)