前言
通过post或者get下载路径，还需要知道下载完成的状态，知道什么时候下载完成。
IE浏览器或者有些手机的浏览器有些图片不显示，因为图片路径不被浏览器识别。概述
显示图片大家都知道只要用img标签，把url给上路径就可以显示出来了，但是如果是路径是这种
图片在谷歌火狐或者safari显示没有问题，但是在IE上无法正常显示。如果是一png、jpg这种路径的却没有问题。那么怎么来处理这种问题呢？ 思考
为什么这种在IE上无法显示？既然能通过路径获取图片的数据
可不可以直接ajax方法拿到文件数据，然后显示到页面或者下载？获取文件数据
不多说直接上代码
/** * @description 通过请求获取文件 * @param {String} url 请求接口 * @param {Object} data 发送的数据 */getImageUrl(url, data) { return new Promise(resolve => { // new 一个Promise对象 let xmlhttp let formData = new FormData() // 这里用的是formData包装数据，根据自己项目可以改成普通的json数据传输 用json传输注意转换成字符串 // let data = JSON.stringify(data) if (data) { Object.keys(data).forEach(item => { if (data[item]) { formData.append(item.toString(), data[item]) } }) } xmlhttp=new XMLHttpRequest() xmlhttp.open("GET", url, true); xmlhttp.responseType = "blob" // 返回响应数据的类型 xmlhttp.onload = function(){ if (xmlhttp.status == 200) { let fileUrl = window.URL.createObjectURL(xmlhttp.response) let fileName = decodeURI(xmlhttp.getResponseHeader('content-disposition').split('filename=')[1].replace(/\"/g, '')) //如果是下载文件需要在header中获取文件名 这里可能提取文件名不能完全符合每个项目，如果获取的不对 通过xmlhttp.getResponseHeader('content-disposition')方法自行正则或者其他方法拿到文件名 resolve({ fileName, fileUrl, fileBlob: xmlhttp.response }) } } xmlhttp.send(formData) })} 通过这个方法就可以完成下载一个文件了，并生成一个本地路径 用法：
const download = (url, data) => { getUrl(url, data).then(file => { // 这里可以只用file.flieUrl然后将这个赋值给页面的图片就能解决IE不能现在某些特殊路径的图片的问题 if (window.navigator.msSaveBlob) { // IE 兼容IE不支持download window.navigator.msSaveOrOpenBlob(file.fileBlob, file.fileName) return } let elementA = document.createElement("a") document.body.appendChild(elementA) elementA.setAttribute('href', file.fileUrl) elementA.setAttribute('download', file.fileName) elementA.click() document.body.removeChild(elementA) })} 这短代码演示的post方法并用FormData包装数据，请求方法和格式可根据自己项目随意修改。