axios 使用 blob 下载文件怎么兼容 JSON 出错状态

正常情况下,这代码是可以下载文件

export function downloadMedia(id) {
    return request({
        url: '/cases/download',
        method: 'get',
        responseType: 'blob',
        params: {
            id
        }
    })
}

但是如果后端返回出错信息json,那么这个时候axios不能正常捕获因为responseType: 'blob' 这个怎么处理

{
    "msg":"您没有权限下载文件!",
    "data":[],
    "code":400
}
最佳答案

自问自答.我在axios里面拦截response处理.

instance.interceptors.response.use(
    async(response) => {

        // token过期,服务器返回新的token
        let token = response.headers.authorization
        if (token) {
            store.dispatch('auth/refreshToken', token)
        }

        // 兼容blob下载出错json提示
        if (response.request.responseType === 'blob' && response.data instanceof Blob && response.data.type && response.data.type.toLowerCase().indexOf('json') != -1) {
            return new Promise((resolve, reject) => {
                let reader = new FileReader()
                reader.onload = () => {
                    response.data = JSON.parse(reader.result)
                    resolve(Promise.reject(response.data.msg))
                }

                reader.onerror = () => {
                    reject(response.data.msg)
                }

                reader.readAsText(response.data)
             })
        }
}
)
2个月前 评论
讨论数量: 2

自问自答.我在axios里面拦截response处理.

instance.interceptors.response.use(
    async(response) => {

        // token过期,服务器返回新的token
        let token = response.headers.authorization
        if (token) {
            store.dispatch('auth/refreshToken', token)
        }

        // 兼容blob下载出错json提示
        if (response.request.responseType === 'blob' && response.data instanceof Blob && response.data.type && response.data.type.toLowerCase().indexOf('json') != -1) {
            return new Promise((resolve, reject) => {
                let reader = new FileReader()
                reader.onload = () => {
                    response.data = JSON.parse(reader.result)
                    resolve(Promise.reject(response.data.msg))
                }

                reader.onerror = () => {
                    reject(response.data.msg)
                }

                reader.readAsText(response.data)
             })
        }
}
)
2个月前 评论

我是直接根据 返回结果 res.data.type === 'application/json' 判断下载还是提示错误

4周前 评论

请勿发布不友善或者负能量的内容。与人为善,比聪明更重要!