IE浏览器，文件下载失败，onDownloadProgress方法里报错：无法获取未定义或null引用的属性“getResponseheader“

问题背景：

谷歌、火狐、edge都没有问题，ie11浏览器也没有问题，ie10及以下会报错，无法获取未定义或null引用的属性"getResponseheader

 查看代码，getResponseHeader这个方法是在获取进度条的时候使用，

//xml返回数据的钩子函数，可以用来获取数据的进度 具体可查看axios的官网
onDownloadProgress: progressEvent => {
    //progressEvent.loaded 下载文件的当前大小
    //progressEvent.total  下载文件的总大小 如果后端没有返回 请让他加上！
    let progressBar = Math.round((progressEvent.loaded / progressEvent.srcElement.getResponseHeader('x-content-length')) * 100);
    // ...其他逻辑操作
}

在ie10浏览器下，控制台打印 progressEvent 对象，发现 progressEvent.srcElement 为null，其他版本的浏览器 progressEvent.srcElement 是有值的，并且可以通过 getResponseHeader() 获取到响应头里的值。

修改后：使用 progressEvent?.target?.getResponseHeader() 方法获取，x-content-length需要后端接口设置在响应头中。问题解决

let progressBar = Math.round((progressEvent.loaded / progressEvent?.target?.getResponseHeader('x-content-length')) * 100);

这里说一下为什么不使用 progressEvent.total 或者 content-length 来获取下载文件的总大小？

因为当开启了gzip之后，这两个值是有问题的。影响进度条的准确性，可以和后台约定好一个字段，比如 x-content-length 返回文件总大小，然后通过 progressEvent.target.getResponseHeader('x-content-length') 方法获取就行了。

问题解决。