ant design pro 踩坑和填坑 —— request.js

问题：异常统一处理

描述：

在大部分状况下，后台请求异常时，都会返回对应的状态码，400，404，500等等，可是，如今一些后端设计返回response.status都为200，经过code或者status来判断请求是否正确，从而开始了这个坑的攻克。

问题处理：（此处用登陆状态失效为例，status为3时登陆失效）

首先是发现了response.json()是一个promise，因此在处理的时候确定是使用promise的方式来处理：

const res = response.json();
  res.then(data => {
   if (data.status === 3) {
     
     const errortext = codeMessage[401];      
      const error = new Error(errortext);
      error.name = response.status;
      error.response = response;
      throw error;
   }
   return data;
 });

刚开始觉得这样处理就能够了，没有return这个promise，因此在models里call了一个undefined，至关郁闷，因此开始走了一些歧路：
一直想着返回值是个Promise，因此就想着本身造一个

const res = response.json();
const promiseRes = res.then(data => {
  const promise =  new Promise((resolve) => {
    if (data.status === 3 {
      message.error('登陆状态失效,请从新登陆', 3, () => {
        window.g_app._store.dispatch({
          type: 'login/logout',
        });
      });
    }
    resolve(data);
  })
  return promise;
})
return promiseRes;

虽然好像是解决了问题，可是又是resolve又是好几层的return，怎么看都以为别扭，可是因为项目忙就将就用了一段时间。
后来意识到了res自己就是一个promis，因此直接去掉了那一层别扭的promis（PS: 内心感受各类舒畅）

const res = response.json();
      
      return res.then(data => {
        if (data.status === 3) {
          const errortext = codeMessage[401];     
              const error = new Error(errortext);
              error.name = response.status;
              error.response = response;
              throw error;
        }
        return data;
      });

问题：fetch若进入catch会致使代码出错

描述：

这个问题产生于后台请求报常规错误时产生的，当后台返回状态码为500或者401后，进入catch，会发现antd pro 返回个啥，return; ???啥，这不就是返回了一个undefined么，而后致使了代码报undefined的错误，更离谱的是，是401的时候，跳转登陆，从新登陆后，出错的列表页，列表仍是为空，甚至没有从新请求接口。

问题解决：

解决办法一： 使用神奇的 ...

put({
  type: '',
  payload: {
    ...response
  }
});

// 一样的在reduce里面也须要作相应的处理

return {
    ...state,
    some: { ...payload }
}

解决办法二：暴力解决，多是一个不是办法的办法，可是好像有点卵用

return; 改为return e;

因此求一个更好的解决办法，拜谢！！！

一些小问题：

1.当body的值是一个字符串时：

newOptions.body =  JSON.stringify(newOptions.body); // 当为字符串的时候会有两对引号
 
  newOptions.body = typeof newOptions.body !== 'string' ? JSON.stringify(newOptions.body) : newOptions.body; // 因此加一个判断

2.修改总体请求头'Content-Type': 'application/x-www-form-urlencoded'

仅仅须要改为qs的stringify： s=1&a=2

import { stringify } from 'qs';

/*
 * 此处省略
 */
newOptions.body = typeof newOptions.body !== 'string' ? stringify(newOptions.body) : newOptions.body;