axios下载pdf
一般情况下,网页上下载资源,都是通过<a href="https://aaa.com/download?a=b">选组</a>
连接跳转之后,会自动下载,说白了就是get请求
这种是最简单的,但是有时候满足不了要求,比如添加header参数等。
postman
是个好东西,可以通过点击Send and Download
来实现。如果只是进行send操作,那返回的就是流数据
前端用的axios
发起的请求,那axios
如果发送下载操作呢
function downloadFile () {
let data = {
'pageSize': 10,
'producer': 3,
'country': 'ke'
}
axios({
method: 'get',
url: 'http://127.0.0.1:9090/download',
params: data,
responseType: 'blob'
}).then((res) => {
console.log('headers', res.headers)
let fileName = res.headers['content-disposition'].split('=')[1]
handle(res.data, fileName)
}
)
}
function handle (data, fileName) {
// 文件导出
if (!data) {
return
}
let url = window.URL.createObjectURL(new Blob([data], { type: 'application/pdf' }))
const a = document.createElement('a')
a.style.display = 'none'
a.download = fileName
a.href = url
a.click()
if (document.body.contains(a)) {
document.body.removeChild(a)
}
}
注意点
- type: 'application/pdf' 是需要处理下,如果指定为pdf,那下载的文件名后缀就是pdf。
- 响应头'content-disposition'如果为空,有可能是服务端跨域未处理该头。
比如如果是nginx处理的,需要加add_header 'Access-Control-Expose-Headers' 'Content-Disposition';
OK,简简单单!
面朝大海```春暖花开
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· DeepSeek 解答了困扰我五年的技术问题
· 为什么说在企业级应用开发中,后端往往是效率杀手?
· 用 C# 插值字符串处理器写一个 sscanf
· Java 中堆内存和栈内存上的数据分布和特点
· 开发中对象命名的一点思考
· DeepSeek 解答了困扰我五年的技术问题。时代确实变了!
· PPT革命!DeepSeek+Kimi=N小时工作5分钟完成?
· What?废柴, 还在本地部署DeepSeek吗?Are you kidding?
· DeepSeek企业级部署实战指南:从服务器选型到Dify私有化落地
· 程序员转型AI:行业分析