vue中点击按钮直接下载doc和pdf文件的方法

1.下载文件所需方法

后台返回路径格式：/annex/附件1：青海省气象数据提供使用协议.docx

前端获取方法：http://192.136.1.111:8080/file/get.htm?url=/product/2024/ce836e34a09e45d4a0ebef7d9f658175.pdf

<el-link type="primary" @click="downloadFile(downLoadUrl + param.annex2,'xxxxx.doc')">

getBlob(url) {
  return new Promise((resolve) => {
    const xhr = new XMLHttpRequest()
    xhr.open('GET', url, true)
    xhr.responseType = 'blob'
    xhr.onload = () => {
      if (xhr.status === 200) {
        resolve(xhr.response)
      }
    }

    xhr.send()
  })
},

/**
 * 保存 blob
 * filename 想要保存的文件名称
 */
saveAs(blob, filename) {
  if (window.navigator.msSaveOrOpenBlob) {
    navigator.msSaveBlob(blob, filename)
  } else {
    const link = document.createElement('a')
    const body = document.querySelector('body')
    link.href = window.URL.createObjectURL(blob)
    link.download = filename

    // fix Firefox
    link.style.display = 'none'
    body.appendChild(link)

    link.click()
    body.removeChild(link)

    window.URL.revokeObjectURL(link.href)
  }
},
/**
 * 下载
 * @param  {String} url 目标文件地址
 * @param  {String} filename 想要保存的文件名称
 */
downloadFile(url, filename) {
  this.getBlob(url).then((blob) => {
    this.saveAs(blob, filename)
  })
}