外观
yidun-midend-dashboard — 易盾统一运营后台(qiankun 微前端)
分层:表现层 | 部署单元:20 个前端应用 + 1 个共享库(全部非容器化)| 数据库:无(纯前端)| base image:无(无 Dockerfile,静态目录 + 外部 nginx)
一、模块定位与架构
把内容安全、业务安全、应用安全、AI 等数十条产品线的运营/管理界面,用 qiankun 微前端聚合到同一个登录态、同一套权限与导航下的统一运营门户(union-admin);运营、策略、审核、交付人员在一个入口里完成所有日常操作。它不做业务逻辑,只是各后端产品线的“入口闸门”——微应用注册错会白屏、权限 key 配错会菜单不显示、网关地址错会全站 401/403。
架构分层
- 主应用/壳:
packages/platform(Vue3 + Vite,负责登录、权限、导航与 qiankun 注册表mircoAppConfig) - 微应用群:18 个 Vite 子应用(
system/product/meta/strategy-center/package-center/supplier/portrait/risk-manage/app-reinforce/app-detect/fingerprint/consult-console/censor-platform/export-center/antispam-admin/image-recognition/ai-intelligent-assistant/ai-evaluation)+yidun-console(Vue2.7 + vue-cli,历史大仓) - 共享库:
packages/union-admin-shared(fetchUtils、v-auth、<Permission>、SuperTable等)
关键数据流
- 浏览器访问
union-admin.nis.netease.com→platform经认证网关/auth(VITE_LOGIN_URL)完成登录 common_getCurrentUser()(/union-user/...)拉用户与权限点 → 写入qiankunStore,通过#childContainer挂载子应用- qiankun 按
activeRule匹配并加载子应用entry(https://union-admin.nis.netease.com/<pkg>/index.html) - 子应用内 axios fetcher 经
/gateway(VITE_API_BASE_URL,shenyu 网关)调后端 →code!==200判错、401跳登录、HTTP 403 提示“暂无权限” - 生产构建可由
--useCdn把静态资源上传 NOS bucketyidunfe(CDNhttps://yidunfe.nosdn.127.net/<pkg>/)
二、可部署服务清单
| 部署单元目录 | npm 包名 | 镜像名 | 端口(dev) | 服务类型 | 独立 Dockerfile | 是否进 kubernetes.yml |
|---|---|---|---|---|---|---|
packages/platform | platform | 无(不构建) | 7000 | 主应用/壳(qiankun 容器) | 无 | 否 |
packages/system | system | 无(不构建) | 7001 | 微应用(系统设置) | 无 | 否 |
packages/package-center | package-center | 无(不构建) | 7002 | 微应用(套餐中心) | 无 | 否 |
packages/product | product | 无(不构建) | 7003 | 微应用(产品业务中台) | 无 | 否 |
packages/strategy-center | strategy-center | 无(不构建) | 7003 ⚠️冲突 | 微应用(策略中心) | 无 | 否 |
packages/meta | meta | 无(不构建) | 7004 | 微应用(元数据中心) | 无 | 否 |
packages/censor-platform | censor-platform | 无(不构建) | 7004 ⚠️冲突 | 微应用(人审运营平台) | 无 | 否 |
packages/supplier | supplier | 无(不构建) | 7005 | 微应用(供应商中台) | 无 | 否 |
packages/portrait | portrait | 无(不构建) | 7101 | 微应用(风险画像) | 无 | 否 |
packages/risk-manage | risk-manage | 无(不构建) | 7102 | 微应用(智能风控) | 无 | 否 |
packages/app-reinforce | app-reinforce | 无(不构建) | 7103 | 微应用(应用加固) | 无 | 否 |
packages/yidun-console | yidun-console | 无(不构建) | 7104 | 微应用(易盾控制台,Vue2.7) | 无 | 否 |
packages/fingerprint | fingerprint | 无(不构建) | 7105 | 微应用(设备指纹) | 无 | 否 |
packages/consult-console | consult-console | 无(不构建) | 7106 | 微应用(蓝军自动化巡检) | 无 | 否 |
packages/export-center | export-center | 无(不构建) | 7107 | 微应用(通用导出中心) | 无 | 否 |
packages/antispam-admin | antispam-admin | 无(不构建) | 7108 | 微应用(内容安全管理后台) | 无 | 否 |
packages/image-recognition | image-recognition | 无(不构建) | 7109 | 微应用(图像识别管理) | 无 | 否 |
packages/app-detect | app-detect | 无(不构建) | 7110 | 微应用(应用检测) | 无 | 否 |
packages/ai-intelligent-assistant | ai-intelligent-assistant | 无(不构建) | 7110 ⚠️冲突 | 微应用(AI 智能助手) | 无 | 否 |
packages/ai-evaluation | ai-evaluation | 无(不构建) | 7112 | 微应用(大模型测评) | 无 | 否 |
packages/union-admin-shared | union-admin-shared | — 类库,不部署 | — | 共享库(产物 lib/) | 无 | 否 |
全模块无 Dockerfile、无
nginx.conf;只有两处 nginx 片段location.conf(仓库根 +packages/yidun-console/)。部署方式为dist/<pkg>静态目录交给外部 nginx,访问路径https://union-admin.nis.netease.com/<pkg>/index.html。
三、同模块启动顺序
packages/union-admin-shared—— 所有子应用以 workspace 依赖引用它,必须先构建出其lib/。packages/platform—— 主应用/壳,负责登录与 qiankun 注册表,是唯一入口。- 各微应用(可并行) —— 依赖共享库与主应用注册的
entry地址;构建顺序由 lerna 拓扑自动决定(lerna run build)。
理由:npm run install(lerna bootstrap)会按 workspace 依赖建立软链;共享库未构建时子应用无法解析 union-admin-shared。
四、逐服务启动逻辑
根构建 / 部署(package.json + deploy.sh)
package.jsonscripts:install=lerna bootstrap、build=lerna run build、build:test=lerna run build:test、build:private=lerna run build:private(lerna ^4);volta.node=18.16.0deploy.sh:export PATH=/home/appops/ndp-soft/node-v18.16.0-linux-x64/bin:./node_modules/.bin:$PATH→npm install→npm run install→ 有参数则npm run build:$1,否则npm run build- 产物:各包统一
build.outDir=../../dist/<pkg.name>(platform例外,输出到dist/根);union-admin-shared产物在packages/union-admin-shared/lib/
packages/platform(主应用/壳)
- 构建脚本与产物:
vite build --mode production -- --useCdn(另有build:private→--mode private、build:test→--mode tests);packages/platform/vite.config.ts的base = useCdn ? https://yidunfe.nosdn.127.net/platform/ : '/'、build.outDir=../../dist/(输出到 dist 根,非 dist/platform) - 无
vite-plugin-qiankun(不注册为子应用);src/main.ts直接createApp(App).mount('#app') - qiankun 装配:
src/microService/index.ts用registerMicroApps(microApps)+start(),microApps来自src/microService/mircoAppConfig.ts(19 个微应用,含activeRule/entry/authority/hideByPrivate,容器统一#childContainer) - dev:
server.host='local-med.nistest.netease.com'、port=7000、proxy^/gateway/→http://union-admin.nistest.netease.com;WSL 下watch.usePolling=true
packages/yidun-console(Vue2.7 + vue-cli 微应用)
- 构建脚本与产物:
vue-cli-service build --mode production|test|private|offline;vue.config.js的outputDir=../../dist/yidun-console、publicPath='/yidun-console/'、libraryTarget='umd'、jsonpFunction=webpackJsonp_yidun-console(按 qiankun 微应用要求打成 umd) - 入口
src/main.js导出 qiankun 生命周期bootstrap/mount/unmount,并用window.__POWERED_BY_QIANKUN__区分独立运行与被子应用加载 - dev:
devServer.host='local-med.nistest.netease.com'、port=7104,proxy/api//api/ac///logout→http://union-admin.nistest.netease.com/gateway
各 Vite 微应用
- 构建脚本与产物:
vue-tsc --noEmit && vite build --mode production -- --useCdn;vite.config.ts中base = useCdn ? https://yidunfe.nosdn.127.net/<pkg.name>/ : /<pkg.name>/、build.outDir=../../dist/<pkg.name> - 插件:
vite-plugin-qiankun(pkg.name, { useDevMode: true });--useCdn时启用CdnUploadVitePlugin(bucketyidunfe、NOSnos-jd.163yun.com) - dev:
server.host='local-med.nistest.netease.com'、各自port、watch.usePolling=isWsl(os.release().toLowerCase().includes('microsoft'))
五、启动前置依赖
| 依赖 | 配置键 / 地址 | 阻塞 or 弱依赖 | 配置文件 |
|---|---|---|---|
| Node 运行时 | volta.node=18.16.0;deploy.sh 写死 /home/appops/ndp-soft/node-v18.16.0-linux-x64/bin | 阻塞(构建) | package.json、deploy.sh |
| 本机 hosts | local-med.nistest.netease.com 指向本机 | 阻塞(dev 启动) | 系统 hosts(README 明确要求) |
| 统一网关 | VITE_API_BASE_URL=/gateway、http://union-admin.nistest.netease.com/gateway(shenyu) | 弱(运行时) | .env.development / vite.config.ts proxy |
| 认证网关 | VITE_LOGIN_URL=/auth(online)或 https://union-admin.nistest.netease.com/auth | 弱 | .env.* |
| 账号服务 | /union-user/v2/user/info、私有化登录 /union-user/v1/api/login | 弱 | .env.* |
NOS 桶 yidunfe | CDN https://yidunfe.nosdn.127.net/<pkg>/,NOS nos-jd.163yun.com | 弱(仅 --useCdn 构建时) | 各 vite.config.ts |
| Redis / DB / Kafka | 无 | — | — |
六、启动参数与 Profile
- Node 版本:全仓库
volta.node=18.16.0;deploy.sh把node-v18.16.0-linux-x64/bin放在PATH最前 - 构建模式:
production/test/private/offline(主应用 vue-cli 四模式齐备;Vite 子应用为--mode production|tests|private) - 环境文件:
.env.development/.env.production/.env.test(VUE_APP_*/VITE_*),如.env.production的VUE_APP_MODE=production、VUE_APP_API_BASE_URL=/gateway、VUE_APP_LOGIN_URL=/auth;platform/.env.production里VITE_ENTERY_*一律指向https://union-admin.nis.netease.com/<pkg>/index.html - 容器化:无(无 Dockerfile / base image / JAVA_OPTS / kubernetes.yml)
七、启动期踩坑
- 必须配 hosts:README 明确“记得配置
host: [your ip] local-med.nistest.netease.com”,未配则所有子应用 dev server 起不来。 - dev 端口有冲突:仓库要求“每个子项目单独端口”,但实际
product与strategy-center都是 7003、meta与censor-platform都是 7004、app-detect与ai-intelligent-assistant都是 7110——同时跑会互相抢占端口。 useDevMode: true与热更新互斥:vite-plugin-qiankun注释写明“useDevMode=true则不使用热更新插件,useDevMode=false则能使用热更新,但无法作为子应用加载”。- WSL 必须开
usePolling:各vite.config.ts以os.release().toLowerCase().includes('microsoft')判定,WSL 下文件监听依赖轮询,否则改动不触发 HMR。 - 构建链不统一:主应用
platform是 Vue3 + Vite,而yidun-console是 Vue2.7 + vue-cli(umd),同一仓库两套构建与依赖体系,排障需先看清包用的是哪套。 - nginx 只是片段:
location.conf仅try_files $uri $uri.html $uri/ /index.html(SPA 回退),仓库无完整nginx.conf、无 Dockerfile,部署需外部 nginx 手工接入并按/gateway反代后端。 yidun-console在注册表中hidden: true:mircoAppConfig里它被隐藏(入口/yidun-console/m/risk-manage/data/statics),改导航时要留意“隐藏但仍注册”。--useCdn把 AK/SK 写进构建配置:CdnUploadVitePlugin的accessId/secretKey硬编码在各vite.config.ts,且 CDN 模式下base变为绝对 CDN 域名——本地/离线环境误带--useCdn会加载不到资源。
八、跨模块前置
- 上游:认证网关
/auth(登录、登出、验证码,VITE_LOGIN_URL)、yidun-account(用户信息/union-user/v2/user/info、私有化登录)——二者均为运行时 HTTP 契约,非代码依赖。 - 下游:各子应用经
/gateway(shenyu)调用antispam-*/yidun-*后端;前端是这些后端产品线的运营入口,后端未起时对应子应用只有接口报错、整站仍可用。 - 构建期前置:Node 18.16.0 必须可用,且
union-admin-shared要先能构建;npm install/lerna bootstrap需可访问内网 npm 源(.npmrc)。 - 无服务端启动顺序约束:本模块是全栈最顶层的静态资源,不阻塞任何后端;反之建议各后端
/gateway路由就绪后再验收微应用功能。
与既有描述差异:既有描述称
packages/yidun-console为主应用/壳;实际主应用是packages/platform(src/microService/index.ts的registerMicroApps+start(),mircoAppConfig注册 19 个微应用),yidun-console是注册表中hidden: true的 Vue2.7 微应用。