导出文件接口报300，前端解决方案

最新推荐文章于 2024-02-08 15:57:20 发布

别忘了微笑_cuicui

最新推荐文章于 2024-02-08 15:57:20 发布

阅读量1.3k

点赞数 2

CC 4.0 BY-SA版权

分类专栏： vue+element项目bug 文章标签： vue+element项目bug

本文链接：https://blog.youkuaiyun.com/CuiCui_web/article/details/89394528

vue+element项目bug 专栏收录该内容

22 篇文章

订阅专栏

本文介绍了一种处理后台返回流数据的错误信息的方法，通过使用axios和FileReader将流转换为JSON，实现对特定错误代码的捕获和用户友好提示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

当后台返回的报错信息是一个流的时候，前端不能直接拿到信息，需要进行转化。

axios({
  url: '接口地址',
  method: 'post',
  responseType: 'blob',
  headers, // 请求头
  data // 导出数据传参
}).then((res) => {
  if(res){
  // 将流转换为json
    var reader = new FileReader();
    reader.onload = function(event){
      let message  = '';
      try {
        message  = JSON.parse(reader.result);
        if(message.hasOwnProperty('responseCode') && message.responseCode=='300'){
         // 给出提示语，进行拦截提示
          that.$notify({
            type: 'error',
            message: message.messageList[0].message,
            duration: 1500
          });
        }
      }catch (e) {
       // 如果是正常情况，返回的文件流就不会出现response，所以用try...catch进行处理一下
        const content = res;
        const dowLoadFileName = "导出的文件名";
        this.exportSearchList(dowLoadFileName, content);
      }
    };
    reader.readAsText(res);
  }
}).catch((error) => {
  throw error;
});