js调用后台接口下载.docx .xlsx. 需要接口设置为arraybuffer. 可能项目里面设置了统一的拦截代理，会有影响，设置arraybuffer返回的不是arraybuffer,我就遇到这种情况。
// 接口请求方法
export function fetchDownloadMonitorReport(data: any) {
return axios.post("/hb/monitorReport/downloadReport", data, {
responseType: 'arraybuffer'
});
}
const downloadReport = async row => {
let data = await fetchDownloadMonitorReport({
id: row.id,
})
console.log('data----', data)
const blob = new Blob([data.data], { type: 'application/octet-stream' })
//
// 创建下载链接
const url = URL.createObjectURL(blob)
const link = document.createElement('a')
link.href = url
// 文件名 报告.docx 报告.xlsx
link.setAttribute('download', row.fileName) // 设置下载的文件名
link.style.display = 'none'
document.body.appendChild(link)
// 模拟点击链接以触发下载
link.click()
arraybuffer格式
如果用统一封装接口拦截 要注意 比如根据状态码返回 字节流没有状态码 导致接口可能返回不到数据
service.interceptors.response.use(
response => {
custom_options.loading && closeLoading(custom_options)
if (response.status === 200) {
const res = response.data
if (res.code == 0) {
if (response.config.url == '/DataGov/datafactoryfunction/upload') {
ElMessage({
message: res.msg || '成功',
duration: 1500,
type: 'success',
})
}
return Promise.resolve(res)
} else if (res.code == 200) {
return Promise.resolve(res)
} else if (
// 特意处理 下载的类型 这里用的是response.config
response.config?.url === '/DataGov/dict/exportData' ||
response.config?.url === '/DataGov/class/exportTableExcel'
) {
// 元数据 字典表 导出
return Promise.resolve(res)
} else if (res.code == 50000) {
ElMessage({
message: res.msg || '登录过期',
duration: 1500,
type: 'error',
})
router.push('/login')
return Promise.reject(res)
} else {
console.log('res---------', res, response)
ElMessage({
message: res.msg || '系统错误',
duration: 1500,
type: 'error',
})
return Promise.reject(res)
}
} else {
ElMessage({
message: '系统错误',
duration: 1500,
type: 'error',
})
return Promise.reject('系统错误')
}
},
error => {
custom_options.loading && closeLoading(custom_options)
ElMessage({
message: '系统错误',
duration: 1500,
type: 'error',
})
return Promise.reject(error)
}
)
