vue:后端返回的文件流( type: “application/octet-stream“ ) 转换为base64展示
时间: 2024-10-17 11:07:01 浏览: 158
vueCli3.0文件上传后,后端返回流,前端转换成pdf预览的3种方式
5星 · 资源好评率100%
在Vue.js中,当你从后端获取一个文件流(type通常是"application/octet-stream"),并且需要将其转换成Base64字符串以便于前端显示,可以按照以下步骤操作:
1. 首先,在后端处理文件时,通常会读取其内容并转化为字节数组(byte array)。
2. 然后,将这个字节数组通过`Buffer.from()`或者`new Uint8Array()`等方法转换为JavaScript的`Uint8Array`实例。
3. 使用`btoa()`函数将`Uint8Array`转换为Base64字符串。例如:
```javascript
const fileContent = 'yourFileContent'; // 这里是字节数组
const base64String = btoa(String.fromCharCode(...fileContent));
```
4. 将生成的Base64字符串发送到前端。
5. 在Vue组件中,你可以接收到这个Base64字符串,并显示在一个img标签的`src`属性上,例如:
```html
<img :src="'data:image/jpeg;base64,' + yourBase64String">
```
阅读全文