window.open()打开页签被拦截的问题

需求

后端返回一个全路径地址/或者oss指定文件路径，可以是图片，可以是Pdf,excel,word等等路径，需要前端访问下载。

分析

很多人想到的window.open(url)。简单粗暴，
不足：这种方法遇到浏览器安全系数高的时候会被拦截。而浏览器是有安全设置的，默认是弹出广告，所以被拦截。可能点击一次没什么，但连续点击，用户体验太差了。

优化

目前最为有效的方法，还是通过a 标签。通过click 等事件，认为是人为事件，所以不会被拦截。
然后封装一下，传入url ，和文件名字就可以完美使用了。

// 直接下载Url文件--比如图片，excel,word
export const getUrlUpload = (url,fileName) => {
  return new Promise((resolve, reject) => {
    axios({
      method: 'get',
      url,
      responseType: 'blob'
    }).then((res) => {
      const link = document.createElement('a')
      const blob = new Blob([res.data], { type: res.data.type })
      link.style.display = 'none'
      link.href = URL.createObjectURL(blob)
      link.download = decodeURI(fileName)
      document.body.appendChild(link)
      link.click()
      document.body.removeChild(link)
      resolve()
    }).catch(error => {
      console.log(error)
      message.warning("导出文件" + fileName+'报错');
      reject(error)
    })
  })
}

效果就很丝滑