react umi-request 一套统一的网络请求和错误处理方案

参考文档：

import request, { extend } from umi-request; import { message } from antd; import {history} from umi; const errorHandler = (error: any) => { // 请求已发送但服务端返回状态码非 2xx 的响应 if (error.response) { if (error.data.status === 500) { // 跳转至至指定500页面 // history.push(/500); }else if (error.data.status === 404) { // 跳转至至指定404页面 // history.push(/404); }else { // 若不是500或404，则展示异常message message.error(error.data.message ? error.data.message : error.data); } } else { // 请求初始化时出错或者没有响应返回的异常 message.error(服务器异常); } } // 响应拦截器 // 克隆响应对象做解析处理 request.interceptors.response.use(async response => { const data = await response.clone().json(); // 详情返回的response处理 if(data.code === 500) { switch (data.message) { case systemError: message.error(网络繁忙，请稍后再试); break; case loginTimeout: message.error(登录超时，请重新登录); // 跳转到login页面 // history.push(/login); break; default : break; } } return response; }); // 请求拦截器, 改变url 或 options. request.interceptors.request.use((url, options) => { return { url, options, }; }); // 作为统一错误处理 const http = extend({ errorHandler, }) export default http;

使用方法：service中将request引用改为自定义的http