直接下载下载图片、pdf等文件，无预览过程
直接使用window.open()或window.locat.href()下载文件遇到图片或pdf文件就会跳转预览页，不能满足我想要的点击直接下载文件到本地的需求，尝试多次，最终通过以下方法实现了我的需求。文章来源地址https://www.toymoban.com/news/detail-535727.html
- 鉴于后端返回的是文件路径，首先要将文件url地址转为文件对象，代码如下：
downloadUrlFile (url, fileName) {
return new Promise((resolve, reject) => {
var blob = null
var xhr = new XMLHttpRequest()
xhr.open("GET", url)
xhr.responseType = "blob"
// 加载时处理
xhr.onload = () => {
// 获取返回结果
blob = xhr.response
let file = new File([blob], fileName, { type: 'image/png' })
// 返回结果
resolve(file)
}
xhr.onerror = (e) => {
reject(e)
}
// 发送
xhr.send()
})
},
-
npm install saveAs --save,使用file-saver导出并下载文件
async download (item) {
const { file, file_url, name } = item
// 由于直接用后端返回的完成路径http://xxxx 会出现跨域问题，后端返回的还有一个文件路径，此处'api/'是本地为解决跨域问题而配置的代理,与文件路径拼接就不会出现跨域问题了
const files = await this.downloadUrlFile('api/' + file, name)
saveAs(new Blob([files], { type: 'text/plain;charset=UTF-8' }), name)
},
文章来源：https://www.toymoban.com/news/detail-535727.html
到了这里，关于js下载图片、pdf等文件，无预览的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
