后端输出二维码图片流,VUE前端展示

2 篇文章 0 订阅
2 篇文章 0 订阅

后端输出二维码图片流,VUE前端展示


在这里插入图片描述

 responseType: 'blob',  // 首先在axios中使用blob

在 ajax 请求中,指定 responseType 属性为 blob ,可以下下载一个 Blob 对象。

浏览器允许使用 URL.createObjectURL() 方法,针对 Blob 对象生成一个临时URL,作为图片预览的 URL。

代码示例:

//绑定至img
<el-image :src="imgSrc"></el-image>
 this.$axios.request({
          url: '/xxxxxxx/xxx',
          responseType: 'blob',
          method: 'get',
          params: {id: this.$route.query.id}
        }).then(res => {
          let blob = new Blob([res], { type: "text/html" });
          let url = window.URL.createObjectURL(blob);
          this.imgSrc = url;
        }), (error) => {
          this.$message({
            type: 'warning',
            message: '系统错误,请联系管理员!'
          });
        }
  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

玫光

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值