tms-auth 1.3.26

package/src/utils/sdk.ts

@@ -0,0 +1,608 @@
+import fetchData from './fetch';
+import { stringify } from 'qs';
+import store from '@/store';
+import { UPDATE_LANG } from '@/actions/lang';
+import { HELLO_MSG, REPLY_MSG } from './utils';
+import { history } from 'umi';
+import { recordPath } from '@/layouts/BaseLayout';
+
+type AppMenuList = {
+  id: number;
+  appId: string;
+  sortOrder: number;
+  appDomain: string;
+  defaultDomain: string;
+  children: AppMenuList;
+}[];
+
+const PUBLISH_PATH = /https?:\/\/[^\/]+(.*)/;
+/**
+ * @description 直接出发TMS的接口
+ */
+const TMS_API_DOMAIN = {
+  dev: `https://tms-gateway-dev.chatlabs.net`,
+  uat: `https://tms-gateway-staging.chatlabs.net`,
+  demo: 'https://tms-gateway-demo.chatlabs.net',
+  live: 'https://login.chatlabs.net',
+  portal: 'https://portal.chatlabs.net',
+};
+
+const getTmsAdminApiDomain = (_env: keyof typeof TMS_API_DOMAIN) => {
+  if (!_env || ['dev', 'uat', 'demo', 'live', 'portal'].indexOf(_env) == -1) {
+    _env = 'dev';
+  }
+  const TMS_ADMIN_API_DOMAIN = `${TMS_API_DOMAIN[_env]}/admin`; // swagger上的接口
+  return TMS_ADMIN_API_DOMAIN;
+};
+
+const env = process.env.NODE_ENV;
+const IS_DEV = window.location.hostname == 'localhost';
+
+var showLog = IS_DEV || env === 'development';
+
+class Tms {
+  state = {
+    config: {
+      appDomain: window.location.origin,
+      login_api_domain: '', // TMS 换取 token 和 刷新token 的特定api前缀
+      client_id: '',
+
+      callbackPath: '/callback', // callback路径
+      loginPath: '/login', // 登录页面路径
+      indexPath: '/tmsiframe', // index路径
+      error403Path: '/403', // 403 路径
+      error404Path: '/404', // 403 路径
+
+      tokenKey: 'TOKEN', // token
+      sessionIdKey: 'SESSION_ID', // session-id
+      curAppKey: 'CUR_APP', // 当前应用
+      curMenuKey: 'CUR_MENU', // 当前菜单
+      lastPathKey: 'LAST_PATH', // 上一页面路径
+
+      lang: 'cn', // 语种 cn/en
+      useSessionStorage: false, // 默认为false；true用ssessionStorage，false 用localStorage
+      env: 'dev', // 默认使用tms的dev环境 dev、uat、live
+
+      needPostMsg: true, // 当打开窗口的时候传递数据
+      storage: localStorage,
+    },
+
+    isinitialized: false, // 是否已初始化
+  };
+
+  constructor() {}
+
+  /**
+   *
+   * @param config 初始化的配置项，在业务方 tms/config 文件内
+   */
+  initConfig(config: any = {}) {
+    console.log('当前 tms-auth 包的版本：', 'TMS_AUTH_VERSION');
+    console.log('initConfig', JSON.stringify(config));
+
+    this.state.config = {
+      ...this.state.config,
+      ...config,
+      storage: config.useSessionStorage ? sessionStorage : localStorage,
+    };
+    this.state.isinitialized = true;
+    const tmsConfig = this.state.config;
+    let listener = (e: any) => {
+      try {
+        const data = JSON.parse(e.data);
+        if (data.type === 'logout') {
+          recordPath();
+          history.replace(tmsConfig.loginPath);
+        }
+      } catch (error) {}
+    };
+    window.addEventListener('message', listener, false);
+    store.dispatch({ type: UPDATE_LANG, payload: config.lang || this.state.config.lang });
+  }
+
+  getConfig() {
+    return this.state.config;
+  }
+
+  getConfigByKey(key = '') {
+    return this.state.config[key];
+  }
+
+  checkIsinitialized() {
+    const initialized = this.state.isinitialized;
+    showLog && console.log('检查是否已初始化配置参数', initialized);
+    return initialized;
+  }
+
+  /**
+   *
+   * @param params 非必传
+   * appDomain 默认是 window.location.origin, 若应用的请求数据路径跟其有异，则需要传入该参数
+   * tenant_id 在切换应用的时候才获取
+   */
+  login(params: any = null) {
+    const { config: tmsConfig } = this.state;
+    const domain = IS_DEV
+      ? tmsConfig.appDomain
+      : (params && params.appDomain) || tmsConfig.appDomain;
+    showLog && console.log('login tmsConfig', params, JSON.stringify(tmsConfig));
+
+    window.location = `${TMS_API_DOMAIN[tmsConfig.env]}/auth/oauth/authorize?client_id=${
+      tmsConfig.client_id
+    }&response_type=code&redirect_uri=${domain}${tmsConfig.callbackPath}&app_domain=${domain}${
+      params && params.tenant_id ? `&TENANT-ID=${params.tenant_id}` : ''
+    }&language=${tmsConfig.lang}`; // 直接跳转这个路径，由后端进行重定向
+  }
+
+  //租户当前应用无权限时跳转
+  tmsErrorLogin(params: any = null) {
+    const { config: tmsConfig } = this.state;
+    const domain = IS_DEV
+      ? tmsConfig.appDomain
+      : (params && params.appDomain) || tmsConfig.appDomain;
+    showLog && console.log('login tmsConfig', params, JSON.stringify(tmsConfig));
+
+    window.location = `${TMS_API_DOMAIN[tmsConfig.env]}/auth/token/login?client_id=${
+      tmsConfig.client_id
+    }&response_type=code&redirect_uri=${domain}${
+      tmsConfig.callbackPath
+    }&app_domain=${domain}&relogin=true&language=${tmsConfig.lang}`; // 直接跳转这个路径，由后端进行重定向
+  }
+
+  /**
+   *
+   * @param params 非必传
+   * tenantId 默认从sessionStorage获取；如果无法从sessionStorage里获取token 以及 tenant_id 等信息，则需要从参数中传入，一般发生在登录时账号报错/不匹配/无权限等异常情况
+   * sessionId 默认从sessionStorage获取；如无法从sessionStorage获取，则需要从参数中传入，一般发生在登录时账号报错/不匹配/无权限等异常情况
+   * @returns
+   */
+  logout(params = {}) {
+    showLog && console.log('logout 接口', params);
+    // window?.parent?.postMessage(JSON.stringify({ type: 'logout' }), '*');
+    return new Promise((resolve, reject) => {
+      try {
+        const { login_api_domain, sessionIdKey, tokenKey } = this.state.config;
+        const TmsStorage = this.getStorage();
+        const tokenStr = TmsStorage.getItem(tokenKey) || '{}';
+        const tokenObj = JSON.parse(tokenStr);
+
+        const dataParams = {
+          sessionId: TmsStorage.getItem(sessionIdKey),
+          ...params,
+        };
+
+        // 如登录时发生错误，还没来得及获取到token，则无accessToken信息，不需要传给后端
+        if (tokenObj && tokenObj.access_token) {
+          dataParams.accessToken = tokenObj.access_token;
+        }
+
+        fetchData(
+          `${login_api_domain}/sso/logout?${dataParams ? stringify(dataParams) : ''}`,
+          'GET',
+          null,
+          {
+            'TENANT-ID': (params && params.tenantId) || tokenObj.tenant_id,
+          },
+        )
+          .then((res) => {
+            return res.json();
+          })
+          .then((res) => {
+            console.log('logout fetchData res', res);
+            const { code, data, msg } = res;
+            if (code == 0) {
+              TmsStorage.removeItem(sessionIdKey);
+              TmsStorage.removeItem(tokenKey);
+              if (window.opener) window.opener = null; // 避免login加载message监听事件
+              resolve();
+            } else {
+              reject(res);
+            }
+            // {code: 1, msg: 'Invalid authorization code: 1PdJQT', data: 'invalid_exception'}
+          });
+      } catch (error) {
+        console.log('logout fetch data error', error);
+      }
+    });
+  }
+
+  /**
+   *
+   * @param params 必传
+   * callback   callback页面，默认获取当前页面，如有不同则需传入
+   * code       由TMS返回，在query上获取
+   * TENANT-ID  由TMS返回，在query上获取
+   * SESSION-ID 由TMS返回，在query上获取
+   * @returns
+   */
+  getToken(params = {}) {
+    showLog && console.log('getToken', params);
+    return new Promise((resolve, reject) => {
+      try {
+        const { login_api_domain, sessionIdKey, tokenKey, callbackPath, appDomain } =
+          this.state.config;
+        const TmsStorage = this.getStorage();
+        const tenantId = params['TENANT-ID'],
+          sessionId = params['SESSION-ID']; // 这个TENANT-ID、SESSION-ID是后端返回的参数，不能改
+        const dataParams = {
+          callback: `${appDomain}${callbackPath}`,
+          ...params,
+        };
+        fetchData(
+          `${login_api_domain}/sso/token?${dataParams ? stringify(dataParams) : ''}`,
+          'GET',
+          null,
+          {
+            'TENANT-ID': tenantId,
+          },
+        )
+          .then((res) => {
+            return res.json();
+          })
+          .then((res) => {
+            console.log('getToken fetchData res', JSON.stringify(res), res);
+            const { code, data, msg } = res;
+            if (code == 0 && data) {
+              TmsStorage.setItem(sessionIdKey, sessionId);
+              TmsStorage.setItem(tokenKey, JSON.stringify(data));
+
+              resolve(data);
+            } else {
+              const { loginPath, appDomain } = this.state.config;
+              console.log('getToken fetchData reject ');
+              if (code == 425) {
+                return this.tmsErrorLogin();
+              }
+              const publishPath = (appDomain.match(PUBLISH_PATH) || [])[1];
+              const redirectLogin =
+                typeof publishPath === 'string' && publishPath !== '/'
+                  ? publishPath + loginPath
+                  : loginPath;
+
+              this.logout({
+                sessionId: sessionId,
+                tenantId: tenantId,
+              })
+                .then(() => {
+                  window.location.href = redirectLogin;
+                })
+                .catch((err) => {
+                  window.location.href = redirectLogin;
+                });
+            }
+            // {code: 1, msg: 'Invalid authorization code: 1PdJQT', data: 'invalid_exception'}
+          });
+      } catch (error) {
+        console.log('getToken fetch data error', error);
+      }
+    });
+  }
+
+  /**
+   * 刷新token
+   * @returns
+   */
+  refreshToken() {
+    showLog && console.log('refreshToken');
+    return new Promise((resolve, reject) => {
+      try {
+        const { config: tmsConfig } = this.state;
+        const TmsStorage = this.getStorage();
+        const tokenStr = TmsStorage.getItem(tmsConfig.tokenKey);
+        const tokenObj = JSON.parse(tokenStr);
+
+        const dataParams = {
+          refreshToken: tokenObj.refresh_token,
+        };
+
+        fetchData(
+          `${tmsConfig.login_api_domain}/sso/refreshToken?${
+            dataParams ? stringify(dataParams) : ''
+          }`,
+          'GET',
+          null,
+          {
+            'TENANT-ID': tokenObj.tenant_id,
+          },
+        )
+          .then((res) => {
+            return res.json();
+          })
+          .then((res) => {
+            console.log('refreshToken fetchData res', JSON.stringify(res), res);
+            const { code, data, msg } = res;
+            if (code == 0 && data) {
+              TmsStorage.setItem(tmsConfig.tokenKey, JSON.stringify(data));
+              resolve(data);
+            } else {
+              reject(res);
+            }
+            // {code: 1, msg: 'Invalid authorization code: 1PdJQT', data: 'invalid_exception'}
+          })
+          .catch((err) => {
+            reject(err);
+          });
+      } catch (error) {
+        console.log('refreshToken fetch data error', error);
+      }
+    });
+  }
+
+  // 更新token，如果失效了直接自动登录
+  refreshTokenWithAutoLogin(recordPath = true) {
+    console.log('refreshTokenWithAutoLogin: 我在刷新token');
+    return new Promise((reslove, reject) => {
+      const { config: tmsConfig } = this.state;
+      showLog && console.log('refreshTokenWithAutoLogin --- tmsConfig', tmsConfig);
+      const TmsStorage = this.getStorage();
+      const tokenStr = TmsStorage.getItem(tmsConfig.tokenKey);
+      if (tokenStr) {
+        const tokenObj = JSON.parse(tokenStr);
+        this.refreshToken()
+          .then((tokenRes) => {
+            // window.location.reload();
+            reslove();
+          })
+          .catch((err) => {
+            console.log(err, 'errCode');
+            this.login();
+          });
+      } else {
+        this.login();
+      }
+    });
+  }
+  getauthorization(tokenParams: any) {
+    if (tokenParams?.token_type && tokenParams?.access_token) {
+      return `${tokenParams.token_type} ${tokenParams.access_token}`;
+    } else {
+      return '';
+    }
+  }
+
+  // 获取当前token的权限菜单
+  getAuthApp() {
+    showLog && console.log('getAuthApp');
+    return new Promise((resolve, reject) => {
+      try {
+        const tmsConfig = this.state.config;
+        const TmsStorage = this.getStorage();
+        const tokenStr = TmsStorage.getItem(tmsConfig.tokenKey) || '{}';
+        const tokenParams = JSON.parse(tokenStr);
+
+        fetchData(`${getTmsAdminApiDomain(tmsConfig.env)}/tenant/app`, 'GET', null, {
+          authorization: this.getauthorization(tokenParams),
+          'TENANT-ID': tokenParams?.tenant_id || '',
+        })
+          .then((response) => {
+            response
+              .clone()
+              .json()
+              .then((res) => {
+                const resData = {
+                  httpStatus: response.status,
+                  ...res,
+                };
+                const { code, data, msg } = res;
+                if (response.status === 200 && code == 0) {
+                  resolve(resData);
+                } else {
+                  reject(resData);
+                }
+              });
+          })
+          .catch((error) => {
+            reject({ httpStatus: 'failFecth' });
+          });
+      } catch (error) {
+        console.log('getAuthApp fetch data error', error);
+      }
+    });
+  }
+
+  // 获取当前token的权限菜单
+  /**
+   *
+   * @param params 必传
+   * @returns appId 应用id
+   */
+  getAuthMenu(params = {}) {
+    showLog && console.log('getAuthMenu');
+    return new Promise((resolve, reject) => {
+      try {
+        const tmsConfig = this.state.config;
+        const TmsStorage = this.getStorage();
+        const tokenStr = TmsStorage.getItem(tmsConfig.tokenKey) || '{}';
+        const tokenParams = JSON.parse(tokenStr);
+
+        fetchData(
+          `${getTmsAdminApiDomain(tmsConfig.env)}/tenant/menu?${params ? stringify(params) : ''}`,
+          'GET',
+          null,
+          {
+            authorization: `${tokenParams.token_type} ${tokenParams.access_token}`,
+            'TENANT-ID': tokenParams.tenant_id,
+          },
+        ).then((response) => {
+          response
+            .clone()
+            .json()
+            .then((res) => {
+              const resData = {
+                httpStatus: response.status,
+                ...res,
+              };
+              const { code, data, msg } = res;
+              if (response.status === 200 && code == 0) {
+                resolve(resData);
+              } else {
+                reject(resData);
+              }
+            });
+        });
+      } catch (error) {
+        console.log('getAuthMenu fetch data error', error);
+      }
+    });
+  }
+
+  updateLanguage(lang: string) {
+    return new Promise((resolve, reject) => {
+      try {
+        this.state.config.lang = lang;
+        store.dispatch({ type: UPDATE_LANG, payload: lang });
+        resolve(lang);
+      } catch (error) {
+        reject(error);
+      }
+    });
+  }
+
+  updateDocumentTitle(title: string) {
+    return new Promise((resolve, reject) => {
+      try {
+        document.title = title;
+        resolve(title);
+      } catch (error) {
+        reject(error);
+      }
+    });
+  }
+
+  updateDocumentIcon(src: string) {
+    return new Promise((resolve, reject) => {
+      try {
+        var t = document.getElementsByTagName('link');
+        for (var i = 0; i < t.length; i++) {
+          if (t[i].rel == 'icon' || t[i].rel == 'shortcut icon') {
+            t[i].remove();
+          }
+        }
+
+        var linkEle = document.createElement('link');
+        linkEle.href = src || '/favicon.ico';
+        linkEle.type = 'image/x-icon';
+        linkEle.rel = 'shortcut icon';
+        document.head.appendChild(linkEle);
+        resolve(src);
+      } catch (error) {
+        reject(error);
+      }
+    });
+  }
+
+  /**
+   *
+   * @param path 非必传，默认取当前页面 window.location.href
+   * @returns
+   */
+  recordCurrentPath(path: string) {
+    return new Promise((resolve, reject) => {
+      try {
+        const tmsConfig = this.state.config;
+        const TmsStorage = this.getStorage();
+        var currentPath = path || window.location.href;
+        if (window.location.pathname != tmsConfig.loginPath) {
+          TmsStorage.setItem(tmsConfig.lastPathKey, currentPath);
+          resolve(currentPath);
+        } else {
+          reject(new Error('当前页面是login，不能记录'));
+        }
+      } catch (error) {
+        reject(error);
+      }
+    });
+  }
+
+  getStorage() {
+    const tmsConfig = this.state.config;
+    return tmsConfig.useSessionStorage ? sessionStorage : localStorage;
+  }
+  /**
+   *
+   * @param param
+   * link 跳转链接
+   * data 其他数据
+   */
+  openWindow({ link, data: realData = {} }) {
+    let done = false;
+    const MAX_TIME = 40000; // 页面会在打开后20s内接收数据，所以发送预留的时间稍长一点，避免新打开的页面加载过慢
+
+    const tmsConfig = this.state.config;
+    const TmsStorage = this.getStorage();
+    const windowObj = window.open(link);
+
+    const linkStr = link.split('/');
+    const targetDomain = linkStr[0] + '//' + linkStr[2];
+
+    if (tmsConfig.needPostMsg) {
+      console.log('开始发送请求消息', new Date().getTime());
+      const interval = setInterval(() => {
+        windowObj?.postMessage(HELLO_MSG, targetDomain);
+      }, 16.66);
+      setTimeout(() => {
+        if (!done) {
+          console.log('超时关闭postMessage', new Date().getTime());
+          clearInterval(interval);
+          done = true;
+        }
+      }, MAX_TIME);
+
+      const listener = (event: MessageEvent<any>) => {
+        let { data, source, origin } = event;
+        console.log('收到响应消息', origin, data, new Date().getTime());
+        if (data == REPLY_MSG && origin != window.location.origin && !done) {
+          done = true;
+          clearInterval(interval);
+
+          const tokenInfo = TmsStorage.getItem(tmsConfig.tokenKey);
+          const appInfo = TmsStorage.getItem(tmsConfig.curAppKey);
+          const _data = {
+            ...realData,
+            language: tmsConfig.lang,
+            userInfo: tokenInfo ? JSON.parse(tokenInfo) : null,
+            fromApp: realData && realData.fromApp ? realData.fromApp : JSON.parse(appInfo),
+          };
+          const _postMsg = JSON.stringify(_data);
+
+          console.log('发送认证数据', _postMsg, targetDomain, new Date().getTime());
+          windowObj?.postMessage(_postMsg, targetDomain);
+          window.removeEventListener('message', listener);
+        }
+      };
+      window.addEventListener('message', listener);
+    }
+  }
+
+  /**
+   * @description 排序 menu 和 app 菜单
+   * @param {AppMenuList} list
+   * @return {*}  {AppMenuList}
+   * @memberof Tms
+   */
+  sortAppMenu(list: AppMenuList): AppMenuList {
+    const new_list = (list || []).sort((a, b) => {
+      let a_sort = typeof a.sortOrder === 'object' ? Number.MAX_SAFE_INTEGER : a.sortOrder;
+      let b_sort = typeof b.sortOrder === 'object' ? Number.MAX_SAFE_INTEGER : b.sortOrder;
+      return a_sort == b_sort ? a.id - b.id : a_sort - b_sort;
+    });
+
+    const hasChild = new_list.some((item) => item.children && item.children.length > 0);
+    if (hasChild) {
+      // children也要sort
+      const listWithChildren = new_list.map((item) => {
+        const children_list = item.children;
+        const newItem = item;
+        if (children_list && children_list.length > 0) {
+          newItem.children = this.sortAppMenu(item.children);
+        }
+        return newItem;
+      });
+      return listWithChildren;
+    } else {
+      return new_list;
+    }
+  }
+}
+
+export default new Tms();

package/src/utils/utils.ts

@@ -0,0 +1,15 @@
+import qs from 'qs';
+
+export const toSearchObj = (str?: string) => {
+  var obj;
+  try {
+    obj = qs.parse((str || '').slice(1));
+  } catch (e) {
+    console.log('catch', e);
+  }
+  return obj || {};
+};
+
+
+export const HELLO_MSG = 'You have a message, please reply "ready" to recieve it.';
+export const REPLY_MSG = 'ready';

package/tsconfig.json

@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "outDir": "dist",
+    "target": "es5",
+    "module": "esnext",
+    "moduleResolution": "node",
+    "jsx": "react",
+    "lib": ["dom"],
+    "esModuleInterop": true,
+    "types": ["jest"],
+    "strict": true,
+    "skipLibCheck": true,
+    "declaration": true,
+    "baseUrl": "./",
+    "paths": {
+      "@/*": ["src/*"]
+    }
+  }
+}

package/typings.d.ts

@@ -0,0 +1,2 @@
+declare module '*.css';
+declare module '*.less';