vue中前端解析图片文件流显示在页面上
第一步、设置图片显示区域<img :src="currentPicture" alt="">第二步、配置获取图片流接口export function getCurrent(dev){return api({url:'/xxx',methid:'get',responseType:'blob',params:{dev}})}第三步、文件流转化地址init(){
·
第一步、设置图片显示区域
<img :src="currentPicture" alt="">
第二步、配置获取图片流接口
export function getCurrent(dev){
return api({
url:'/xxx',
method:'get',
responseType:'blob',
params:{dev}
})
}
第三步、文件流转化地址
init(){
getCurrent(this.routename).then(res => {
let blob = new Blob([res.data],{type:'image/jpeg'})
this.currentPicture = window.URL.createObjectURL(blob)
})
}
转化后的地址长这样:
blob:http://localhost:8080/7083d583-a30e-45f9-ac56-5674e93da8c8
new Blob的type参数查看浏览器控制台response header的content-type
更多推荐
已为社区贡献4条内容
所有评论(0)