如何在前端使用 Angular5 管理 responseType = 'blob'答案

【问题标题】：How to manage responseType = 'blob' using Angular5 in Front end如何在前端使用 Angular5 管理 responseType = 'blob'
【发布时间】：2018-10-05 14:15:05
【问题描述】：

我想下载一个doc.pdf，它有一个文本'My first file download'。当我尝试下载到 zip 文件时，我的文件有一些 files.xml 就像这张照片

您能建议我如何将此文件转换为 pdf 格式吗？

请按照我的代码：

组件.ts

  export(id: string) {
    this.ss.download(id)
      .subscribe(data => { console.log(`excel data: ${data}`); FileSaver.saveAs(data, 'doc.zip') },
        error => console.log('Error downloading the file.'),
        () => console.log('Completed file download.'));
  }

service.ts:

  public download(id: string): Observable<any> {
    //let oReq = new XMLHttpRequest();
    // let options = new RequestOptions({ responseType: ResponseContentType.Blob });
    let params = new URLSearchParams();
    let headers = new Headers();
    headers.append('x-access-token', this.auth.getCurrentUser().token);
    headers.append('sale_id', id);
    headers.append('Content-Type', 'application/json;charset=UTF-8');
    headers.append('responseType':'arraybuffer');
    return this.http.get(Api.getUrl(Api.URLS.download), {
      headers: headers,
      responseType: ResponseContentType.Blob,

    }).map(res => res.blob()) 
  }

必需参数有：方法get。参数需要在header中发送。

【问题讨论】：

您确定此文件最初是PDF 吗？您发现以 ZIP 格式打开的内容非常清楚地指向 DOCX，这是现代 MS-Word 格式。
事实上我的文件是.docx 我想以pdf或docx格式下载
所以...如果它在 docx 中，为什么你不能按原样？
因为，当我下载 .docx 时出现这样的问题：stackoverflow.com/questions/50005473/…
当我尝试下载这个文档表单邮递员时，当我点击send 时我会发帖PK z—LO‹Ý< _rels/.rels<?xml ... 当我点击邮递员send and download 时我会发邮件给我真正的文件.docx

标签： xml angular typescript blob

【解决方案1】：

我不知道这是否对你有帮助（我对你的工具不太感兴趣）

您正在下载的文件是DOCX 格式。这是现代的 MS-Word 格式。这种格式 - 即使它具有不同的扩展名 - 也是一个简单的 ZIP 文件。

任何压缩文件开头的PK 是一个魔法代码，告诉消费者这是什么类型的文件。

“PK”回到“PKWARE”并指向 Phil Katz，他是 zip 格式的发明者之一。

压缩文件 - 与任何其他文件一样 - 只是一堆字节。消费者必须知道，如何阅读和解释这一点。

您应该尝试将字节流完全写入文件，将其命名为“However.docx”并尝试使用 MS-Word 打开它。

如果这没有帮助，字节流可能会被压缩，或者以某种方式自身被编码......至少你给我们展示的图片看起来不像这样。

不要尝试将带有复制和粘贴的字符带到任何类型的编辑器中。这样的文件有几个不可见的字符，它们会丢失...获取字节并存储它们就像你得到它们一样（你会做同样的存储 JPEG）。

【讨论】：