postman请求一个接口返回的body是个pdf文件 在vue中请求这个接口得怎么写才能把这个pdf文件下载下来 最好多种写法
时间: 2024-03-23 15:42:55 浏览: 134
可以使用 axios 库来请求接口,然后通过 Blob 对象将返回的数据转换为文件,最后使用 a 标签下载文件。
以下是示例代码:
```javascript
import axios from 'axios'
// 请求接口,并将返回的数据转换为文件
axios({
url: 'your-api-url',
method: 'GET',
responseType: 'blob'
}).then(response => {
// 将数据转换为文件
const blob = new Blob([response.data], { type: 'application/pdf' })
const url = window.URL.createObjectURL(blob)
// 创建 a 标签并设置 download 属性
const link = document.createElement('a')
link.href = url
link.download = 'file.pdf'
// 将 a 标签添加到文档中并模拟点击
document.body.appendChild(link)
link.click()
// 释放 URL 对象
window.URL.revokeObjectURL(url)
})
```
另外,还可以使用 FileSaver.js 库来简化文件下载的操作。示例代码如下:
```javascript
import axios from 'axios'
import { saveAs } from 'file-saver'
// 请求接口,并将返回的数据转换为文件
axios({
url: 'your-api-url',
method: 'GET',
responseType: 'blob'
}).then(response => {
// 将数据转换为文件并保存
const file = new File([response.data], 'file.pdf', { type: 'application/pdf' })
saveAs(file)
})
```
这样就可以通过浏览器的下载管理器下载 PDF 文件了。
阅读全文