Angular 6:从后端服务器获取文件对象后下载文件

2024-02-05

我有一个结构为 {type: "Buffer", data: Array(702549)} 的文件对象类型,我需要在 Angular 6 中做什么才能在浏览器中下载此文件?

我从这个函数得到我的回应:

  getMarketingProposalById(id: string): Observable<MarketingProposal> {
    return this.httpClient.get<MarketingProposal>(this.apiUrl  + id , this.httpOptions).pipe(map(marketingProposal => {
      if (marketingProposal.materials[0] && marketingProposal.materials[0].file) {
        const blob = new Blob([marketingProposal.materials[0].file.data], { type: 'image/png' });
        console.log(blob);
        // saveAs(blob, 'hello.png');
      }
      const marketingProposalObject = this.assignMarketingProposalObject(marketingProposal);
      this.mapStringToDate(marketingProposalObject);
      return marketingProposalObject;
    }));
  }

marketingProposal.materials[0].file 的格式为 {type: "Buffer", data: Array(702549)}


您可以使用文件保护程序来执行此操作:https://www.npmjs.com/package/file-saver https://www.npmjs.com/package/file-saver

文件下载代码:

import { saveAs } from 'file-saver';

loadFile(fileId: number) {
   try {
       let isFileSaverSupported = !!new Blob;
   } catch (e) { 
       console.log(e);
       return;
   }

   this.repository.loadFile(fileId).subscribe(response => {
       let blob = new Blob([response.data], { type: 'application/pdf' });
       saveAs(blob, `file${fileId}.pdf`);
   });
}

UPDATE:我根据负载条件创建了一个测试项目:

http.get('http://localhost:4200/assets/image.png', {responseType: 'blob'}).subscribe(response => {
  try {
      let isFileSaverSupported = !!new Blob;
  } catch (e) { 
      console.log(e);
      return;
  }
  let blob = new Blob([response], { type: 'image/png' });
  saveAs(blob, `file.png`);
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angular 6:从后端服务器获取文件对象后下载文件 的相关文章

随机推荐

  • var express = require('express') - 无法读取未定义的属性“prototype”

    我是 Express 新手 如果这是一个简单的问题 请原谅我 我有一个 React 项目 我正在尝试向其中添加 Express 我添加了一个以下行开头的 js 文件来导入express var express require express
  • 您可以通过 API 添加亚马逊购物车的地址吗?

    我在产品广告 API 中看不到它参考 http docs aws amazon com AWSECommerceService latest DG CartCreate html但我想知道是否可以动态 自动设置亚马逊购物车的送货账单地址 以
  • 将异步生成器聚合到元组

    在尝试聚合异步生成器的结果时 如下所示 async def result tuple async def result generator some await things happening in here yield 1 yield
  • OpenSSL、RVM、Brew、冲突错误

    当我跑步时酿造医生在终端中 我收到以下错误 Warning Some keg only formula are linked into the Cellar You may wish to brew unlink these brews o
  • pandas 重命名索引值

    我在 pandas python 中有以下数据框 B X Y A alpha 3 5 5 beta 9 9 11 我想将 alpha 更改为另一个名称 例如 mu 我应该怎么办 Use rename http pandas pydata o
  • 更深入地理解Python对象机制

    我想更好地理解 Python 3 x 数据模型 但我没有找到 Python 对象行为的完整和精确的解释 我正在寻找参考资料 如果我下面展示的每个案例都可以链接到 Python API 参考资料或 PEP 或任何其他有价值的资料 那就太好了
  • NavHostFragment 无法从 XML 访问

    我想尝试新的导航库 关注后本指南 https developer android com topic libraries architecture navigation navigation implementing我在运行时遇到错误 Ca
  • 如何解决在同一页面上包含文件上传和其他文本输入的

    我的表格需要帮助 我想将输入 文本区域和文件上传混合到数据库中 我在 中使用什么 我是否使用正常形式属性
  • Eclipse 继续崩溃

    今天我的 Eclipse 继续崩溃并向我显示以下消息 A fatal error has been detected by the Java Runtime Environment SIGSEGV 0xb at pc 0x00007f9d6
  • 链接静态库,共享另一个静态库

    我目前有一个用于非常大的代码库的 Xcode 项目 我将其称为X计划 我将其分为一堆子项目 项目A B C 到目前为止 每个项目都可以自行编译 效果很好 它们都生成静态库 项目B and 项目C依赖于生成的静态库项目A为了建造 我有另一个
  • 在 Golang 中导入包的本地更改而不推送代码

    我现在正在学习 Golang 而且还是个新手 我有一个关于包裹的问题 考虑以下场景 假设我有一个包裹github com ilatif A我正在其中导入另一个包github com ilatif B like import github c
  • 收到推送通知时添加新通知(不替换之前的通知)

    我在我的应用程序中使用推送通知 我需要在发送推送通知时显示通知 如果我发送另一个通知 没有清除之前的通知 它将替换旧的通知 这是我使用的代码 NotificationManager mNotificationManager Notifica
  • 谷歌应用程序脚本中的 CopyTo 将无法完成超过 1000 行的执行

    I am using originalRange copyTo rangeToCopyTo to basically pull down functions for the number of rows of data I have Cop
  • PHP - 我们应该在会话中包含哪些数据?

    这是一个初学者的问题 在网站中 会话中应该或不应该包含什么类型的数据 我了解我不应包含任何需要保证安全的信息 我对编程最佳实践更感兴趣 例如 可以在会话中包含一些数据 否则这些数据将作为依赖项注入从一个页面发送到另一个页面 这不是相当于创建
  • 如何在 Python 中将 CIDR 前缀转换为点分四组网络掩码?

    如何在 Python 中将 CIDR 前缀转换为点分四组网络掩码 例如 如果前缀是12我需要返回255 240 0 0 这是一个较轻松的解决方案 没有模块依赖项 netmask join str 0xffffffff lt lt 32 le
  • 如何将指针设置到第零位置?

    据我所知 在预处理阶段 代码中所有出现的 NULL 都会被 0 替换 然后在编译期间 指针上下文中出现的所有 0 都将替换为在该机器上表示 NULL 的适当值 因此 编译器必须知道该特定机器的 NULL 值 现在 这意味着每当我在指针上下文
  • R 中的合并命令

    我一直在使用 R 中的合并命令 并试图找出如何使用 SUFFIX 参数 在线文档并没有很好地解释它 我想做的是导入一些 csv 文件 data1 lt read csv fileA header T data2 lt read csv fi
  • 我想一次滚动多个回收器视图如何实现

    我想滚动多个RecyclerView一次如何实现该 Exp 我有 3RecyclerView水平方向 当我第一次滚动时RecyclerView那么第二个和第三个也应该滚动怎么办 答案很简单 你必须从一个回收视图获取滚动反馈并将其传递给其他回
  • python中的return和break有什么区别?

    python中的return和break有什么区别 请解释一下它们在循环和函数中到底做了什么 谢谢 break用于提前结束循环 whilereturn是用于将返回值传递回函数调用者的关键字 如果不带参数使用它 它只会结束函数并返回到之前执行
  • Angular 6:从后端服务器获取文件对象后下载文件

    我有一个结构为 type Buffer data Array 702549 的文件对象类型 我需要在 Angular 6 中做什么才能在浏览器中下载此文件 我从这个函数得到我的回应 getMarketingProposalById id s