下载内容类型为Content-Type的文件:multipart/mixed

Question

我正在做一个有角度的应用程序,我必须点击一个休息终点并下载作为响应发送的文件,但我不知道如何去做.我有如下的响应头

内容处置:附件; 文件名= "Config.zip" 内容类型:多部分/混合;边界= Boundary_25_1816124633_1519993185650 MIME-版本:1.0传送编码:分块

并且响应看起来像

--Boundary_25_1816124633_1519993185650内容类型:application/json

{"config":[{},{},{}]} --Boundary_25_1816124633_1519993185650内容类型:application/octet-stream

PKMÛJAä;%RecurrenceEvent_CreateContract_1.jsoníYKoãF¾ÈxÝ0è÷M7MbL&ÝÝK0Í|CD¬1ðß(J¤HÙ²¼yV'»ÙU¬®úªú«â€œ«åºv~\Í~ùöýw³Ù,È«ù

编辑

这是我的http电话,它指向后端

return this.http.get(url).map(response => {
// TODO
});

如何下载附加的zip文件？请帮忙.我被卡住了.

Answer 1

const executeSaveAs = (content) => {
    let blob = new Blob([content], {'type': "application/octet-stream"});
    saveAs(blob, "downloaded_zip.zip"); // This is from https://github.com/eligrey/FileSaver.js
};

return this.http.get(url, {responseType: 'arraybuffer'}).pipe(executeSaveAs);

我们需要设置预期的响应类型,我们希望它是'arraybuffer'.然后,我们为FileSaver做常用的事情,即创建一个blob并将其传递给包的saveAs函数.

编辑

根据评论,要求澄清解析多部分响应的各个部分.

有关Multipart内容类型的信息

标题中定义的边界表示响应的不同部分.每个部件都以该行开头

--boundaryThatIsInTheHeader

方法

我们可以根据边界分割响应.为此,我们必须首先从头部解析边界.RegEx到我们这里救援:

let boundaryRegex = new RegExp(/boundary=(\S+)/g);
const header = `Content-Disposition:attachment; filename="Config.zip" Content-Type:multipart/mixed;boundary=Boundary_25_1816124633_1519993185650 MIME-Version:1.0 Transfer-Encoding:chunked`; // As in the question

const boundary = '--' + boundaryRegex.exec(header)[1]; // We obtain the boundary here

现在,我们需要将响应与边界分开作为分隔符.

response.split(boundary);

为服务器的此特定响应返回的值将是

[ "", " Content-Type: application/json\n\n {\"config\":[{},{},{}]} ", " Content-Type: application/octet-stream\n\n PKMÛJAä;%RecurrenceEvent_CreateContract_1.jsoníYKoãF¾ÈxÝ0è÷Ã7Mb L&íÝK0ͦCD¬1ðß(J¤HÙ²¼yV'»ÙU¬®úªú«â· ö«åºv~Í~ùöýw³Ù,È«ù"]

注意数组的第二个元素,即JSON.这就是我们想要的!我们现在可以使用简单的RegEx删除额外的数据,即内容类型.如果响应的格式是常量,我们也可以根据索引直接删除它.zip文件的内容也是如此.