Feat/1.x/error center

packages/xconsole-error-center/README.md

@@ -5,7 +5,62 @@
 
 ## Usage
 
+* use in `appConfig.js`
+
 ```js
-import XconsoleErrorCenter from '@alicloud/xconsole-error-center';
+config.errorCenter = {
+  enable: true,  // 全局配置，配置为 false 的话，所有异常都不会被 ErrorCenter 处理
+  errorCodes: {
+    ConsoleNeedLogin: {
+      enable: false, // 默认 true
+      type: "prompt", // 错误展示类型，默认 prompt
+      // 以下都是传递给 prompt 的配置信息
+      title: 'Error Title', // 弹窗标题，默认获取 intl(errorCode)，例如 intl(ConsoleNeedLogin)
+      message: '登录失效，请重新登录', // 弹窗信息，默认值为 error.message
+      // message: (error) => 'you want string', 
+      confirmLabel: '重新登录', // 确定按钮文案
+      confirmHref: 'https://aliyun.com', // 点击确定跳转的链接
+      cancelLabel: '留在页面', // 取消按钮文案
+      cancelHref: 'https://aliyun.com', // 点击取消跳转的链接
+      i18nMessages: {}
+    },
+    PostonlyOrTokenError: (err) => {
+      // 也可以使用为错误码配置 callback，errorCenter 会优先使用传递的 callback 处理异常
+      window.loaction.reload();
+    }
+  },
+  include: ['ConsoleNeedLogin', 'PostonlyOrTokenError'], // include 只有配置才生效
+  exclude: [], // include 存在时 exclude 无效
+  globalErrorCode: { // 未命中 errorCodes 中的配置时默认使用的全局处理配置或方法
+    enable: false, // 默认 true
+    type: "prompt", // 错误展示类型，默认 prompt
+    // 以下都是传递给 prompt 的配置信息
+    title: 'Error Title', // 弹窗标题，默认获取 intl(errorCode)，例如 intl(ConsoleNeedLogin)
+    message: '登录失效，请重新登录', // 弹窗信息，默认值为 error.message
+    // message: (error) => 'you want string', 
+    confirmLabel: '重新登录', // 确定按钮文案
+    confirmHref: 'https://aliyun.com', // 点击确定跳转的链接
+    cancelLabel: '留在页面', // 取消按钮文案
+    cancelHref: 'https://aliyun.com', // 点击取消跳转的链接
+    i18nMessages: {}
+  }
+  // globalErrorCode: (error, code) => {}
+};
 ```
 
+* use `ErrorPrompt`
+```js
+import { ErrorPrompt } from '@alicloud/xconsole-error-center';
+
+ErrorPompt(error, {
+  // 以下都是传递给 prompt 的配置信息
+  title: 'Error Title', // 弹窗标题，默认获取 intl(errorCode)，例如 intl(ConsoleNeedLogin)
+  message: '登录失效，请重新登录', // 弹窗信息，默认值为 error.message
+  // message: (error) => 'you want string', 
+  confirmLabel: '重新登录', // 确定按钮文案
+  confirmHref: 'https://aliyun.com', // 点击确定跳转的链接
+  cancelLabel: '留在页面', // 取消按钮文案
+  cancelHref: 'https://aliyun.com', // 点击取消跳转的链接
+  i18nMessages: {}
+})
+```

packages/xconsole-error-center/src/consume.js

@@ -1,15 +1,23 @@
 import * as ErrorConsumers from './internal';
 import _get from 'lodash.get';
 
-const consume = (error, errorCodes, include, exclude, getMessage) => {
-  const code = _get(error, 'response.data.code') || error.code;
-  const errorConfig = errorCodes[code];
-
-  if (typeof errorConfig === 'function') return errorConfig(error);
-
-  const { type = 'prompt', enable = true } = (errorConfig || {});
+const process = ({
+  error,
+  code,
+  errorConfig,
+  getMessage
+}) => {
+  if (!errorConfig) return;
+  if (typeof errorConfig === 'function') return errorConfig(error, code);
 
+  const { enable, type = '' } = errorConfig;
   if (!enable) return;
+  if (ErrorConsumers[type]) ErrorConsumers[type]({ error, code, errorConfig, getMessage });
+};
+
+const consume = (error, errorCodes, include, exclude, globalErrorCode, getMessage) => {
+  const code = _get(error, 'response.data.code') || error.code;
+  const errorConfig = errorCodes[code] || globalErrorCode;
 
   if (include && include instanceof Array) {
     if (!include.find((rule) => {
@@ -23,11 +31,12 @@ const consume = (error, errorCodes, include, exclude, getMessage) => {
     })) return;
   }
 
-  if (ErrorConsumers[type]) {
-    ErrorConsumers[type]({ error, code, errorConfig, getMessage });
-  } else {
-    ErrorConsumers.prompt({ error, code, errorConfig, getMessage });
-  }
+  process({
+    error,
+    code,
+    errorConfig,
+    getMessage
+  });
 }
 
 export default consume;

packages/xconsole-error-center/src/index.js

@@ -14,6 +14,7 @@ export default ({
     errorCodes,
     include,
     exclude,
+    globalErrorCode,
     getMessage,
   } = {},
 }) => {
@@ -31,13 +32,13 @@ export default ({
         console.error('[XConsole error-center]', err, err.response); // eslint-disable-line no-console
       }
 
-      consume(err, lastErrorCodes, include, exclude, getMessage);
+      consume(err, lastErrorCodes, include, exclude, globalErrorCode, getMessage);
     },
   }
 };
 
 export const ErrorConsume = consume;
 
-export const ErrorPrompt = (err, { errorConfig = {}, include, exclude, getMessage } = {}) => {
-  consume(err, errorConfig, include, exclude, getMessage);
+export const ErrorPrompt = (err, { errorConfig = {}, include, exclude, getMessage }) => {
+  consume(err, { ...errorConfig, type: 'prompt', enable: true }, include, exclude, getMessage);
 };