前端根据后台返回url下载文件

最新推荐文章于 2025-04-17 16:10:37 发布

原创最新推荐文章于 2025-04-17 16:10:37 发布 · 2k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #javascript #html

前端同时被 2 个专栏收录

59 篇文章

订阅专栏

vue

57 篇文章

订阅专栏

本文介绍如何使用JavaScript在前端通过XMLHttpRequest实现根据不同浏览器下载图片、Word和PDF文件，包括IE的特殊处理和Blob对象的使用。

前端根据后台返回url下载文件（图片、word、pdf）

    getFileAndDownload(fileName, url) {
      var x = new XMLHttpRequest()
      x.open('GET', url, true)
      x.responseType = 'blob'
      x.onload = function(e) {
        var blob = x.response
        if ('msSaveOrOpenBlob' in navigator) {
          // IE导出
          window.navigator.msSaveOrOpenBlob(blob, fileName)
        } else {
          var a = document.createElement('a')
          a.download = fileName
          a.href = URL.createObjectURL(blob)
          $('body').append(a)
          a.click()
          $(a).remove()
        }
      }
      x.send()
    },