XIOS从服务器加载图片并显示

我的需求

请求发送：axios 、前段：vue

1. 服务器不返回图片的url地址，返回图片的数据
2. 获取图片需要登录验证。

请求配置

指定响应类型未blob

请求配置

指定响应类型未blob

axios.get(`图片url`, { responseType: 'blob'})

读取图片

使用FileReader 的readAsDataURL读取图片

let reader = new FileReader()
reader.onload = (e) => {
   this.pic = e.target.result
 }
reader.readAsDataURL(res)

使用图片

将获取到的字符串赋值给img的src即可

< img :src="pic"></img>

小礼物走一走，来简书关注我

作者：陈SunMoon
链接：https://www.jianshu.com/p/dffe0bf9fbd5
来源：简书
简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。