VUE项目后端接口返回图片流,图片在preview里,怎么把图片显示到页面上?

在这里插入图片描述
今天碰到一个接口,后端返的二维码是文件流,在preview里能看到,但response里啥都没有,这种情况怎么拿到这张图片呢?

第一步:设置请求

	//axios封装的请求里面的responseType要设置为blob

第二步:页面调用接口,使用接口返回回显图片

在这里插入图片描述

<img :src="bigPoster" alt="" class="bigPoster" /> //页面图片元素
async myInviteCode() {
    
    
      var data = {
    
    };
      try {
    
    
        let res = await this.$http("myInviteCode", data, "post", true, true);
        console.log(res);//打印能看到文件流
        const href = window.URL.createObjectURL(res.data);//转成url格式
        this.bigPoster = href; //赋值
      } catch (error) {
    
    
        console.log(error);
      }
    },

猜你喜欢

转载自blog.csdn.net/TKP666/article/details/128018407