cloud-web-corejs 1.0.54-dev.745 → 1.0.54-dev.747

package/src/microRouter/index.js

@@ -0,0 +1,389 @@
+/**
+ * qiankun 主应用侧：应用注册表驱动的子应用注册。
+ * 注册表载体为逻辑参数 micro_app_registry（JSON 数组），
+ * 协议见 docs/qiankun微前端改造-实现方案.md 3.2 / 3.4。
+ * 由 permission store 在登录后菜单生成流程中调用（settings.microMainEnabled 门控）。
+ */
+import { loadMicroApp } from "qiankun";
+import { getLogicParamValue } from "@base/api/user";
+import {
+  getAccessPath,
+  validateRegistry,
+  resolveEntry,
+} from "@base/utils/menuAdapter";
+import { getToken } from "@base/utils/auth";
+import router from "@base/router";
+import settings from "@/settings";
+
+export const REGISTRY_PARAM_CODE = "micro_app_registry";
+export const DEBUG_STORAGE_KEY = "micro_app_debug";
+
+const REGISTRY_TIMEOUT = 8000;
+const CONTAINER_WRAPPER_ID = "Appmicro";
+const DEBUG_APP_CODE_REG = /^[A-Za-z][A-Za-z0-9_-]*$/;
+
+// 保活管理：appCode → { instance, el }；离开子应用路由只隐藏容器不卸载，
+// 切回直接显示并经 update 生命周期同步路由，页面状态（页签/表格/表单）得以保留
+let microAppConfigs = {};
+let aliveApps = {};
+let routeHookInstalled = false;
+
+/**
+ * 读应用注册表（第一阶段载体：逻辑参数）。
+ * 非法条目由 validateRegistry 跳过并在控制台显式报错；
+ * 参数缺失 / 请求失败 / 超时一律回落空数组，不阻塞登录流程。
+ */
+export function getAppRegistry() {
+  const fetchPromise = new Promise((resolve) => {
+    getLogicParamValue({
+      data: { paramCode: REGISTRY_PARAM_CODE },
+      failMsg: false,
+      errorMsg: false,
+      modal: false,
+      success: (res) => {
+        const raw = res && res.objx;
+        if (!raw) {
+          resolve([]);
+          return;
+        }
+        const { apps, errors } = validateRegistry(raw);
+        if (errors.length) {
+          console.error(
+            "[microRouter] 应用注册表存在非法条目（已跳过）：",
+            errors
+          );
+        }
+        resolve(apps);
+      },
+    }).catch(() => resolve([]));
+  });
+  const timeoutPromise = new Promise((resolve) => {
+    setTimeout(() => {
+      resolve([]);
+    }, REGISTRY_TIMEOUT);
+  });
+  return Promise.race([fetchPromise, timeoutPromise]).then((apps) =>
+    applyDebugOverrides(apps)
+  );
+}
+
+/**
+ * 本机调试覆盖：localStorage.micro_app_debug 仅在当前浏览器生效，
+ * 用于"发布环境主应用 + 本机子应用"的联调，不影响其他用户。四档写法：
+ *   "1"                          → settings.microDebugAppCode + microDebugEntry
+ *   "appB"                       → appB + 默认调试入口
+ *   "appB=http://localhost:9530/" → 指定入口；多个用逗号分隔，可混写
+ *   '[{"appCode":"..","entry":".."}]' → 完整条目数组
+ * 与注册表按 appCode 合并：已存在的条目覆盖 entry 并强制 enabled，不存在的追加。
+ */
+function getDebugOverrides() {
+  let raw = null;
+  try {
+    raw = window.localStorage.getItem(DEBUG_STORAGE_KEY);
+  } catch (e) {
+    return [];
+  }
+  if (!raw || !(raw = raw.trim())) return [];
+  const defaults = {
+    appCode: settings.microDebugAppCode || "",
+    entry: settings.microDebugEntry || "",
+  };
+  let items = [];
+  if (raw.charAt(0) === "[") {
+    try {
+      const list = JSON.parse(raw);
+      items = (Array.isArray(list) ? list : []).map((item) => ({
+        appCode: (item && item.appCode) || "",
+        entry: (item && item.entry) || defaults.entry,
+      }));
+    } catch (e) {
+      console.error(
+        "[microRouter] micro_app_debug JSON 解析失败，已忽略：",
+        e.message
+      );
+      return [];
+    }
+  } else if (raw === "1" || raw === "true") {
+    items = [defaults];
+  } else {
+    items = raw.split(",").map((part) => {
+      const idx = part.indexOf("=");
+      const code = (idx > -1 ? part.slice(0, idx) : part).trim();
+      const entry = idx > -1 ? part.slice(idx + 1).trim() : defaults.entry;
+      return { appCode: code, entry };
+    });
+  }
+  return items.filter((item) => {
+    if (!DEBUG_APP_CODE_REG.test(item.appCode || "") || !item.entry) {
+      console.error(
+        "[microRouter] micro_app_debug 非法条目已跳过：",
+        JSON.stringify(item)
+      );
+      return false;
+    }
+    return true;
+  });
+}
+
+function applyDebugOverrides(apps) {
+  const overrides = getDebugOverrides();
+  if (!overrides.length) return apps || [];
+  const result = (apps || []).slice();
+  overrides.forEach((override) => {
+    const existing = result.find((app) => app.appCode === override.appCode);
+    if (existing) {
+      existing.entry = override.entry;
+      existing.enabled = true;
+    } else {
+      result.push({
+        appCode: override.appCode,
+        appName: override.appCode + "(本地调试)",
+        entry: override.entry,
+        hasCorejs: true,
+        enabled: true,
+      });
+    }
+    console.warn(
+      "[microRouter] ⚠ 本地调试覆盖生效：" +
+        override.appCode +
+        " → " +
+        override.entry +
+        "（删除 localStorage." +
+        DEBUG_STORAGE_KEY +
+        " 后刷新恢复）"
+    );
+  });
+  return result;
+}
+
+/**
+ * activeRule 由 appCode 推导：hash 首段即归属首段，与菜单访问路径天然一致。
+ */
+export function buildActiveRule(appCode) {
+  const prefix = "#/" + appCode;
+  return (location) => {
+    const hash = location.hash || "";
+    return (
+      hash === prefix ||
+      hash.indexOf(prefix + "/") === 0 ||
+      hash.indexOf(prefix + "?") === 0
+    );
+  };
+}
+
+/**
+ * 登记子应用（保活模式）：不再走 registerMicroApps/start 的 activeRule 自动装卸，
+ * 改为路由钩子驱动的 loadMicroApp 手动装载——首次进入装载，离开只隐藏，切回显示并同步路由。
+ * options.subAppMenus 为 menuAdapter.dispatchMenus 的切分结果。
+ */
+export function registerSubApps(apps, options = {}) {
+  const env = process.env.NODE_ENV || "development";
+  const subAppMenus = options.subAppMenus || {};
+  const mainAdapter = options.mainAdapter || createDefaultMainAdapter();
+  const userInfo = options.userInfo || null;
+  microAppConfigs = {};
+  (apps || []).forEach((app) => {
+    const entry = resolveEntry(app.entry, env);
+    if (!entry) {
+      console.error(
+        "[microRouter] 子应用缺少当前环境 entry，已跳过：" + app.appCode
+      );
+      return;
+    }
+    microAppConfigs[app.appCode] = {
+      name: app.appCode,
+      entry,
+      props: {
+        appCode: app.appCode,
+        menus: subAppMenus[app.appCode] || [],
+        token: getToken(),
+        lang: localStorage.getItem("i18n-lang") || "",
+        userInfo,
+        mainAdapter,
+      },
+    };
+  });
+  installRouteHook();
+  return Object.keys(microAppConfigs);
+}
+
+// 当前应处于激活态的子应用（等待容器期间用户可能又切走，异步续体据此丢弃过期操作）
+let currentActiveAppCode = null;
+
+function installRouteHook() {
+  if (routeHookInstalled) return;
+  routeHookInstalled = true;
+  router.afterEach((to) => {
+    const appCode =
+      to.meta && to.meta.isMicroApp && microAppConfigs[to.meta.appCode]
+        ? to.meta.appCode
+        : null;
+    currentActiveAppCode = appCode;
+    Object.keys(aliveApps).forEach((code) => {
+      if (code !== appCode) {
+        deactivateMicroApp(code);
+      }
+    });
+    if (appCode) {
+      activateMicroApp(appCode);
+    }
+  });
+}
+
+// 刷新直接落在子应用路由时，afterEach 早于布局渲染（AppMain 懒加载 + showAppMain 延迟），
+// 容器尚未进 DOM——轮询等待，超时显式报错
+const WRAPPER_WAIT_INTERVAL = 100;
+const WRAPPER_WAIT_MAX_TRIES = 100;
+
+function waitForWrapper(tryCount = 0) {
+  const wrapper = document.getElementById(CONTAINER_WRAPPER_ID);
+  if (wrapper) return Promise.resolve(wrapper);
+  if (tryCount >= WRAPPER_WAIT_MAX_TRIES) {
+    console.error(
+      "[microRouter] 等待子应用容器 #" + CONTAINER_WRAPPER_ID + " 超时"
+    );
+    return Promise.resolve(null);
+  }
+  return new Promise((resolve) => {
+    setTimeout(() => {
+      resolve(waitForWrapper(tryCount + 1));
+    }, WRAPPER_WAIT_INTERVAL);
+  });
+}
+
+function getContainerEl(wrapper, appCode) {
+  const id = CONTAINER_WRAPPER_ID + "-" + appCode;
+  let el = document.getElementById(id);
+  if (!el) {
+    el = document.createElement("div");
+    el.id = id;
+    el.style.height = "100%";
+    wrapper.appendChild(el);
+  }
+  return el;
+}
+
+function activateMicroApp(appCode) {
+  const config = microAppConfigs[appCode];
+  if (!config) return;
+  waitForWrapper().then((wrapper) => {
+    if (!wrapper) return;
+    if (currentActiveAppCode !== appCode) return; // 等待期间已切走
+    const el = getContainerEl(wrapper, appCode);
+    el.style.display = "";
+    const alive = aliveApps[appCode];
+    if (!alive) {
+      aliveApps[appCode] = {
+        el,
+        instance: loadMicroApp({
+          name: config.name,
+          entry: config.entry,
+          container: el,
+          props: config.props,
+        }),
+      };
+      return;
+    }
+    // 已保活：显示容器并通知子应用恢复路由监听、同步当前 hash（含"切到本应用另一菜单"的深导航）
+    notifyMicroApp(alive.instance, { microActive: true });
+  });
+}
+
+function deactivateMicroApp(appCode) {
+  const alive = aliveApps[appCode];
+  if (!alive) return;
+  alive.el.style.display = "none";
+  // 暂停子应用路由监听，防止隐藏期间对主应用的 URL 变化做出反应（回写 URL 互相打架）
+  notifyMicroApp(alive.instance, { microActive: false });
+}
+
+function notifyMicroApp(instance, props) {
+  if (!instance || typeof instance.update !== "function") return;
+  const mountPromise = instance.mountPromise || Promise.resolve();
+  mountPromise
+    .then(() => instance.update(props))
+    .catch((e) => {
+      console.error("[microRouter] 子应用 update 通知失败：", e);
+    });
+}
+
+/** 真正卸载全部子应用（登出等场景按需调用；常规页签切换不卸载） */
+export function unmountAllMicroApps() {
+  Object.keys(aliveApps).forEach((code) => {
+    const alive = aliveApps[code];
+    if (alive && alive.instance) {
+      alive.instance.unmount().catch(() => {});
+    }
+    if (alive && alive.el && alive.el.parentNode) {
+      alive.el.parentNode.removeChild(alive.el);
+    }
+  });
+  aliveApps = {};
+}
+
+/**
+ * 每个子应用先按菜单生成精确路由以携带菜单标题等元数据，再追加通配兜底。
+ * 路由均不挂组件，内容由 qiankun 挂进 AppMain 的 #Appmicro 容器。
+ */
+export function buildSubAppRoutes(apps, subAppMenus = {}) {
+  const routes = [];
+  (apps || []).forEach((app) => {
+    const seenPaths = {};
+    (subAppMenus[app.appCode] || []).forEach((menu, index) => {
+      let path = getAccessPath(menu).split("?")[0];
+      if (!path) return;
+      if (!path.startsWith("/")) {
+        path = "/" + path;
+      }
+      if (seenPaths[path]) return;
+      seenPaths[path] = true;
+      routes.push({
+        path,
+        name: `micro-${app.appCode}-menu-${menu.id || menu.menuCode || index}`,
+        meta: {
+          title: menu.menuName || app.appName,
+          enTitle: menu.menuEnName || null,
+          treePathName: menu.treePathName,
+          repeatOpen: menu.repeatOpen,
+          isMicroApp: true,
+          appCode: app.appCode,
+        },
+      });
+    });
+    routes.push({
+      path: "/" + app.appCode + "/*",
+      name: "micro-" + app.appCode,
+      meta: {
+        title: app.appName,
+        isMicroApp: true,
+        appCode: app.appCode,
+      },
+    });
+  });
+  return routes;
+}
+
+// 子应用表单脚本跳主应用路由必须走该回调，不得直接摸主应用 router
+function createDefaultMainAdapter() {
+  return {
+    navigate(path) {
+      const vueRoot = window.$vueRoot;
+      if (vueRoot && vueRoot.$router) {
+        vueRoot.$router.push(path).catch(() => {});
+      }
+    },
+    openTab(path) {
+      this.navigate(path);
+    },
+    closeTab(view) {
+      const vueRoot = window.$vueRoot;
+      if (vueRoot && vueRoot.$store) {
+        return vueRoot.$store.dispatch(
+          "tagsView/delView",
+          view || vueRoot.$route
+        );
+      }
+      return Promise.resolve();
+    },
+  };
+}