当前位置: 首页 > news >正文

后端返回文件流,前端展示图片

1、请求接口时,一定要加上 responseType:'blob',否则返回的格式不对

export function download(id) {

  return request({

    url: `/download?id=${id}`,

    responseType:'blob',

    method: 'get',

  })

}

2、如果现要展示为图片,把返回的文件流转为路径

//res为返回的文件流,一定要写type, 返回的url 为 图片路径

 let url =(window.URL || window.webkitURL).createObjectURL(new Blob([res], { type:'image/png'}));

3、如果要下载,利用document.createElement('a') 创建标签下载

 let url =(window.URL || window.webkitURL).createObjectURL(new Blob([res], { type:'image/png'}));

              let link = document.createElement('a');

              link.style.display = 'none';

              link.href = url;

              link.setAttribute('download', 'png');

              document.body.appendChild(link);

              link.click();

              document.body.removeChild(link);

 

相关文章:

  • AI视觉质检的落地困境与突破路径
  • 架构进阶:精读麦肯锡-_电力公司业务能力架构设计规划咨询项目【附全文阅读】
  • 雪兽云资产助力“星耀汇聚”提升业务效率
  • J2 WebScarab 安装指南详细步骤与配置方法
  • Python入门(二)
  • 【Python os模块完全指南】从基础到高效文件操作
  • PyQt5 实现自定义滑块,效果还不错
  • 【信息系统项目管理师】法律法规与标准规范——历年考题(2024年-2020年)
  • ts 工具类型
  • 【PostgreSQL数据分析实战:从数据清洗到可视化全流程】7.1 主流可视化工具对比(Tableau/Matplotlib/Python库)
  • LLM词编码机制:词映射
  • CTF-DAY9
  • Linux零基础快速入门课程笔记详解
  • Oracle 数据布局探秘:段与区块的内部机制
  • MCP 规范新版本特性全景解析与落地实践
  • 二叉查找树,平衡二叉树(AVL),b树,b+树,红黑树
  • 41.防静电的系列措施
  • CTK的插件框架和QTUI集成方法
  • C++回顾 Day5
  • upload-labs靶场通关详解:第二关
  • 名帅大挪移提前开启,意属皇马的阿隆索会是齐达内第二吗
  • 赵作海因病离世,妻子李素兰希望过平静生活
  • 国务院安委会办公室印发通知:坚决防范遏制重特大事故发生
  • 昆廷·斯金纳:作为“独立自主”的自由
  • 我国外汇储备规模连续17个月稳定在3.2万亿美元以上
  • 韩正出席庆祝中国欧盟建交50周年招待会并致辞