文章目录
- 一、为什么不能直接下载
- 二、如何下载
一、为什么不能直接下载
由于谷歌浏览器机制问题,pdf文件下载和图片下载会有区别,paf文件会打开一个预览页面,在预览页点击下载按钮下载。
二、如何下载
由于pdf文件通过a标签直接下载会打开页面,所以,请求该文件的blob文件流数据,再通过window.URL.createObjectURL转成链接,就可以直接下载了。
只需要替换url和文件名称就行,文件名的后缀记得要写上pdf,不然会变成txt文件。
注意:不能跨域,可以把文件上传到后端服务器,就不会跨域了。还可以用跨域代理处理。
let url = 'http://cn.createpdfonline.org/pdffiles/111(20230922113416).pdf'
let name = '实例.pdf'
// 发送http请求,将文件链接转换成文件流
let xhr = new XMLHttpRequest()
xhr.open('get', url, true)
// 请求类型
xhr.responseType = 'blob'
xhr.onreadystatechange = function() {
// 获取接口结果
if (xhr.readyState === 4 && xhr.status === 200) {
window.URL = window.URL || window.webkitURL
let a = document.createElement('a')
let blob = new Blob([xhr.response])
// 通过二进制文件创建url
let url = window.URL.createObjectURL(blob)
a.href = url
a.download = name
a.click()
// 销毁创建的url
window.URL.revokeObjectURL(url)
}
}
xhr.send()