遇到前端axiso下载文件超过10M被拒绝的问题
2020-07-12 本文已影响0人
明翼
一 问题现象
昨天一朋友遇到超过10M文件,springboot下载文件被拒绝的问题,是秒拒绝。第一反应是不是springboot的配置了限制,通过检查配置,代码和配置中都有文件配置的代码,最大的大小设置为200MB了,根本不存在问题。
其他文件下载小于10MB的,哪怕是9.9MB的文件下载也不存在问题,所以排除了防火墙等问题。
Spring boot的后台提示是如下图:
报错提示
前台的错误提示是网络错误。
二 抓包排查
一连查了很久也没啥思路,所以就想至少我要知道是服务器段的问题还是axiso这个库的问题,所以进行了抓包,显示如下:
抓包
看到客户端在收到服务器端的数据后,接近收完了,发起了Reset报文,进行了中断,导致连接被断开。
三 前端代码
download (url, params, filename) {
NProgress.start()
message.info("开始请求")
return FEBS_REQUEST.post(url, params, {
transformRequest: [(params) => {
let result = ''
Object.keys(params).forEach((key) => {
if (!Object.is(params[key], undefined) && !Object.is(params[key], null)) {
result += encodeURIComponent(key) + '=' + encodeURIComponent(params[key]) + '&'
}
})
return result
}],
responseType: 'blob'
}).then((r) => {
const content = r.data
const blob = new Blob([content])
message.info("请求成功,开始下载...")
if ('download' in document.createElement('a')) {
const elink = document.createElement('a')
elink.download = filename
elink.style.display = 'none'
elink.href = URL.createObjectURL(blob)
document.body.appendChild(elink)
elink.click()
URL.revokeObjectURL(elink.href)
document.body.removeChild(elink)
} else {
navigator.msSaveBlob(blob, filename)
}
NProgress.done()
}).catch((r) => {
console.error(r)
message.error('下载失败,失败原因:' + r)
NProgress.done()
})
很多网上代码也是这样子的,后改造为:
responseType: 'arraybuffer'
更改这种方式后,可以正常下载,我不知道什么原因,暂时记录下。