美文网首页
vue 点击下载pdf

vue 点击下载pdf

作者: IssunRadiance | 来源:发表于2022-04-01 11:28 被阅读0次
正常pdf的url地址,打开只是预览效果,如果想要点击下载pdf到本地
this.fileLinkToStreamDownload(url)
fileLinkToStreamDownload(url) {
  let fileName = this.getDay()
  let reg = /^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(([A-Za-z0-9-~]+).)+([A-Za-z0-9-~\/])+$/
  if (!reg.test(url)) {
    throw new Error('传入参数不合法,不是标准的文件链接')
  } else {
    let xhr = new XMLHttpRequest()
    xhr.open('get', url, true)
    xhr.setRequestHeader('Content-Type', `application/pdf`)
    xhr.responseType = 'blob'
    let that =this
    xhr.onload = function() {
      if (this.status == 200) {
        //接受二进制文件流
        var blob = this.response
        that.downloadExportFile(blob, fileName)
      }
    }
    xhr.send()
  }
},
downloadExportFile(blob, tagFileName) {
  let downloadElement = document.createElement('a')
  let href = blob
  if (typeof blob == 'string') {
    downloadElement.target = '_blank'
  } else {
    href = window.URL.createObjectURL(blob) //创建下载的链接
  }
  downloadElement.href = href
  downloadElement.download = tagFileName
  //下载后文件名
  document.body.appendChild(downloadElement)
  downloadElement.click() //点击下载
  document.body.removeChild(downloadElement) //下载完成移除元素
  if (typeof blob != 'string') {
    window.URL.revokeObjectURL(href) //释放掉blob对象
  }
},
getDay() {
  let time = new Date(),
  year = time.getFullYear(),
  month = time.getMonth() + 1,
  day = time.getDate(),
  timeStem = time.getTime()
  return `${year}/${month}/${day}/${timeStem}.pdf`
}

转载:https://blog.csdn.net/weixin_47047590/article/details/118213366

相关文章

网友评论

      本文标题:vue 点击下载pdf

      本文链接:https://www.haomeiwen.com/subject/dasnjrtx.html