VUE 后端接口返回的是一张图片

Posted 2020-12-11 wyhlightstar

是一个图形验证码的接口，点击验证码可以刷新，问题是我用之前的请求方式只是在 created 里面生效，再次点击就不会请求接口了。不明觉厉.

 

之前的写法是这样的

    // 切换验证码
     changeCodeImg:function(){
　　　　this.verifyImg = ‘/api/login/image?r=‘+Math.random();
　　 },

不管是初始调用，还是点击调用都是可以的，可以在 network 中看到。

但是不知道什么原因，这次不行，点击事件是生效的，但是在 network 看不到请求。

 

所以换了一种写法

    changeCodeImg(){
      axios.get(way.authverifyCode, {
        responseType: ‘blob‘
      }).then((res) => {
        this.identifyingImg = window.URL.createObjectURL(res.data);
      })
　　},

 

注意

responseType: ‘blob‘  这个是必须要有的

 

拿到二进制数据之后使用

window.URL.createObjectURL