当前位置: 首页 > 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);

 

http://www.dtcms.com/a/177304.html

相关文章:

  • 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靶场通关详解:第二关
  • 代码随想录算法训练营第60期第二十九天打卡
  • 超越 DeepSeek-R1,英伟达新模型登顶
  • 在cursor中使用MCP插件生成旅行规划到桌面的执行步骤分析
  • 统计匹配的二元组个数 - 华为OD机试真题(A卷、JavaScript题解)
  • 破解逆向专辑(一)
  • Qt界面设计时窗口中各控件布局及自适应方法
  • 如何用FastMCP快速开发自己的MCP Server?
  • 云硬盘的原理
  • 分布式-Redis分布式锁
  • 从零开始学习three.js(15):一文详解three.js中的纹理映射UV