vue获取图片文件(图形验证码)

问题：

一般前端获取图片都是从后台直接拿到图片的地址值展示就好了，但是最近在做一个图形验证码的功能，后台传输过来的直接是图片文件，console.log(data),输出data会是一长串的乱码

解决方案：

以下是我的http请求代码，axios请求

getValidateCode () {
        this.$http({
          url: this.$http.adornUrl('/a.jpg'),
          method: 'get',
          responseType: 'blob'
        }).then(({data}) => {
          const myBlob = new window.Blob([data], {type: 'image/jpeg'})
          this.Img = window.URL.createObjectURL(myBlob)
        })

1. 在http请求时，加入responseType属性，值为blob
2. 拿到data数据后，对其进行处理，type为image/jpeg
3. 再将其转化为url，在data()中用变量将其存储，就可以直接以:src=’ '的形式引用了

方法及细节参考：前端处理后端接口传递过来的图片文件