• axios请求时根据情况不同服务器返回两种类型的数据,解决方法。例如:请求下载导出一个文件


    我们不需要根据服务器返回的情况去随机设置responseType

    一、我们要明白,我们在请求下载文件的api时候,可能给我们的返回值有两种情况:

    1. 直接给我们了我们想要的文件流
    2. 还有可能得到了JSON返回数据,让我们展现提示出信息或者被叫为错误信息

    二、理解responseType
    axios中这样描述的:responseType`表示服务器响应的数据类型,可以是 'arraybuffer', 'blob', 'document', 'json', 'text', 'stream'
    不过我经常用blob,其实用什么都无所谓,主要看在拿到返回值的时候如何处理。

    三、处理返回值的不同情况

    const API = axios.create({
      baseURL: API_HOST
    })
    API({
          method: 'get',
          url: file.url,
          responseType: 'blob'
        }).then(response => {
        
            const type = response.type || null
            
            //relType你所下载的文件类型,这里是xlsx
            const relType = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
            if (type.includes(relType)) {
              /**做文件下载 */
              
              return
            }
    
            if (type.includes('application/json')) {
                let reader = new FileReader()
                reader.onload = e => {
                    if (e.target.readyState === 2) {
                      let res = {}
                      res = JSON.parse(e.target.result)
                      console.info('back:: ', res)
                    }
               }
               reader.readAsText(response)
            }
          
        })

    根据response.type返回内容的MIME TYPE 来判断是要下载文件,还是要去做一些JSON数据提示什么的操作。如果是JSON类型那就把Blob通过readAsText转为JSON格式。这种方式通过测试IE10和IE10以上版本。

    可以尝试在arrayBuffer的情况下使用arrayBuffer to Json来进行信息提示。

  • 相关阅读:
    特征选择(1)
    sklearn.preprocessing.OneHotEncoder
    朴素贝叶斯算法
    机器学习中 生成式模型 VS 判别式模型
    PHP-FPM 多进程模型
    PHP动态模式和静态模式区别
    Nginx的异步非阻塞
    php并发控制 , 乐观锁
    什么是乐观锁,什么是悲观锁
    redis集群和哨兵的区别
  • 原文地址:https://www.cnblogs.com/zouhao/p/16733952.html
Copyright © 2020-2023  润新知