背景
有的时候后端返回文件,文件是属于stream类型(二进制格式),我们获取到二进制格式的文件后可能是需要下载,也直接在页面上预览等等。
代码
<template>
<div class="app">
<iframe
:src="iframeSrc"
scrolling="auto"
style="border: 0; height: 100vh; width: 100vw"
/>
</div>
</template>
<script>
import axios from 'axios'
export default {
data() {
return {
iframeSrc: '',
}
},
created() {
// 该接口默认返回stream类型。
// responseType: 指定响应结果为blob类型文件
axios
.get('http://127.0.0.1:3000/public/okdd1.pdf', {
responseType: 'blob',
})
.then((res) => {
const data = res.data
// 将blob转blob地址
const url = window.URL.createObjectURL(data)
this.iframeSrc = url
})
},
}
</script>
<style lang="less" scoped></style>
效果
参考
https://blog.csdn.net/weixin_64317807/article/details/134446597
标签:文件,axios,stream,二进制,blob,data,链接 From: https://www.cnblogs.com/it774274680/p/18355851