国产机环境浏览器兼容问题收集（持续收集）
# 国产机环境浏览器兼容问题收集（持续收集）
现象：国产机火狐浏览器环境下导出下载异常（禅道任务：3095）
- 问题代码：
exportEvent () {
this.$http.request({
method: 'get',
url: '/api/other-vaccines-info/export',
responseType: 'blob',
params: this.memberQuery
}).then(res => {
const a = document.createElement('a')
const url = window.URL.createObjectURL(res.data)
const filename = '其他人员台账.xls'
a.style.display = 'none'
a.href = url
a.download = filename
a.click()
window.URL.revokeObjectURL(url)
})
},
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
- 兼容后代码
exportEvent () {
this.$http.request({
method: 'get',
url: '/api/other-vaccines-info/export',
responseType: 'blob',
params: this.memberQuery
}).then(res => {
const a = document.createElement('a')
const url = window.URL.createObjectURL(res.data)
const filename = '其他人员台账.xls'
a.style.display = 'none'
a.href = url
a.download = filename
document.body.appendChild(a) // 将a元素追加至页面
a.click()
document.body.removeChild(a) // 下载触发后移除a元素
window.URL.revokeObjectURL(url)
})
},
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
原因总结：国产机使用的是火狐低版本浏览器，低版本中要想使用a元素进行模拟下载，必须将a元素追加到页面，点击行为才可以使用
上次更新: 2022/05/05, 17:47:41