feat(msgcenter): 消息中心 WS 实时推送前端 + CI 接入 projman 自动链路
build / build (push) Failing after 13s

- Header.vue:铃铛未读角标 + WS 客户端(25s 心跳/断线 5s 重连换新票/newMessage 红点+1+Notice 弹提示)
- BaseApi.ts:getMsgCenterWsTicket(POST /api/msgCenter/wsTicket 代签一次性票据)
- index.html:修复 lodash 引用路径(./libs/lodash.min.js,dev 404 致白屏)
- CI:build.yml 照 notice/front 模板(构建→zip→Nexus front-hosted→webhook 建档);
  userhome deployMode=auto,webhook 后自动发布;凭据 prod.env+projman DB 直读(不走仓库 Secrets)
This commit is contained in:
chenxing
2026-09-19 13:48:32 +08:00
parent 0e3bd97c55
commit efd3b57826
4 changed files with 323 additions and 44 deletions
+99
View File
@@ -0,0 +1,99 @@
name: build
# 前端应用 CI(照 notice/front build.yml 模板):构建 → 打包 zip → 推 Nexus raw → webhook 通知 projman 建档
# 触发:push 到 main / 手动 Run workflow
# userhome 应用 deployMode=auto:webhook 建档后 projman 自动发布前端版本(下载 zip → persist → Caddy 切链)
# 凭据不走仓库 Secrets:runner 与 projman 同机,Nexus 凭据与部署令牌均从宿主 prod.env / projman DB 直读
# (NEXUS_USER 缺省 admin;DEPLOY_TOKEN = app_identity code=proj11-deploy 的明文,与 webhook 校验同源)
on:
push:
branches: [ main ]
workflow_dispatch:
jobs:
build:
runs-on: ubuntu-latest
container:
image: docker:24
options: --network infra-infra-net
steps:
- name: 安装 git / curl / zip(alpine)
run: apk add --no-cache git curl zip
# 内网 Gitea 无法访问 GitHub 拉 actions/checkout,手动 clone 本仓库
- name: 拉取源码(内网无 GitHub,手动 clone 本仓库)
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
run: |
git clone --depth 1 --branch main "http://x-access-token:${GITHUB_TOKEN}@gitea.yunhaixingtong.com/${{ github.repository }}.git" /tmp/src
cp -a /tmp/src/. .
rm -rf /tmp/src
COMMIT_MSG=$(git log -1 --pretty=%s | tr '\n' ' ' | sed 's/["\\]/ /g' | cut -c1-200)
echo "COMMIT_MSG=${COMMIT_MSG}" >> "$GITHUB_ENV"
# 凭据:宿主 prod.env(Nexus)+ projman DB(部署令牌);经 docker.sock 起一次性容器读取,不回显
- name: 读取凭据(prod.env + projman DB)
run: |
set -e
PWD_DB=$(docker run --rm -v /opt/docker/projman-deploy:/pe:ro alpine sh -c "grep '^PROJMAN_DB_PASSWORD=' /pe/prod.env | head -1 | cut -d= -f2-")
NXUSER=$(docker run --rm -v /opt/docker/projman-deploy:/pe:ro alpine sh -c "grep '^PROJMAN_NEXUS_USER=' /pe/prod.env | head -1 | cut -d= -f2-")
NXPASS=$(docker run --rm -v /opt/docker/projman-deploy:/pe:ro alpine sh -c "grep '^PROJMAN_NEXUS_PASSWORD=' /pe/prod.env | head -1 | cut -d= -f2-")
TOKEN=$(docker exec -e MYSQL_PWD="$PWD_DB" mysql8 mysql -uroot -N -e \
"select secret_text from app_identity where code='proj11-deploy' and purpose='deploy_token' limit 1" bsch_projman \
| tr -d '[:space:]')
[ -n "$NXUSER" ] || NXUSER=admin
[ -n "$NXPASS" ] || { echo 'Nexus 凭据缺失'; exit 1; }
[ -n "$TOKEN" ] || { echo 'userhome 部署令牌缺失'; exit 1; }
echo "NEXUS_USER=${NXUSER}" >> "$GITHUB_ENV"
echo "NEXUS_PASSWORD=${NXPASS}" >> "$GITHUB_ENV"
echo "DEPLOY_TOKEN=${TOKEN}" >> "$GITHUB_ENV"
# 前端构建:独立 node 容器(容器名全局唯一,防并发互踩——2026-09-10 三仓同推事故)
- name: 构建前端(node 容器)
run: |
set -e
BUILD_CONTAINER="frontbuild-${GITHUB_RUN_ID:-0}-$(date +%s)"
echo "BUILD_CONTAINER=${BUILD_CONTAINER}"
docker rm -f "$BUILD_CONTAINER" 2>/dev/null || true
docker run -d --name "$BUILD_CONTAINER" -w /build node:20 sleep 3600
docker cp "${PWD}/." "$BUILD_CONTAINER":/build/
docker exec "$BUILD_CONTAINER" sh -c '
set -e
cd /build
if [ -f .npmrc ]; then sed -i "/SASS_BINARY_PATH/d" .npmrc; fi
npm ci --no-audit --no-fund
npm run build
'
echo "=== dist 产物 ==="
docker exec "$BUILD_CONTAINER" sh -c 'ls -la /build/dist/ | head -20'
docker cp "$BUILD_CONTAINER":/build/dist ./dist
docker rm -f "$BUILD_CONTAINER"
echo "BUILD CHECK OK"
# 打包 dist → zip(vite outDir 直出 dist/,zip 根目录直接是 index.html/css/js)
- name: 打包产物
run: |
TAG=$(echo "$GITHUB_SHA" | cut -c1-8)
ZIP_FILE="userhome-front-${TAG}.zip"
cd dist && zip -r "../${ZIP_FILE}" . && cd ..
echo "ZIP_FILE=${ZIP_FILE}" >> "$GITHUB_ENV"
echo "TAG=${TAG}" >> "$GITHUB_ENV"
ls -la "${ZIP_FILE}"
- name: 上传产物到 Nexus
run: |
set -e
NEXUS_URL="http://nexus.yunhaixingtong.com:8081/repository/front-hosted/${ZIP_FILE}"
curl -sSf -X PUT -u "${NEXUS_USER}:${NEXUS_PASSWORD}" --upload-file "${ZIP_FILE}" "${NEXUS_URL}"
echo "NEXUS_URL=${NEXUS_URL}" >> "$GITHUB_ENV"
echo "uploaded to ${NEXUS_URL}"
# 通知 projman:webhook 建档(type=front);userhome deployMode=auto → 建档后自动发布
- name: 通知 projman 建档(auto 发布)
run: |
curl -sSf -X POST "http://192.168.10.160:8090/projman/api/deploy/webhook" \
-H "Content-Type: application/json" \
-H "X-Deploy-Token: ${DEPLOY_TOKEN}" \
-d "{\"app\":\"userhome\",\"front\":\"front\",\"tag\":\"${TAG}\",\"sha\":\"${GITHUB_SHA}\",\"message\":\"${COMMIT_MSG}\",\"nexusUrl\":\"${NEXUS_URL}\"}"
echo "webhook 建档完成,auto 模式将自动发布"
+2 -1
View File
@@ -29,7 +29,8 @@
<title><%- title %></title> <title><%- title %></title>
<link rel="stylesheet" href="./libs/ztree/zTreeStyle.css" /> <link rel="stylesheet" href="./libs/ztree/zTreeStyle.css" />
<script src="./libs/jquery.min.js"></script> <script src="./libs/jquery.min.js"></script>
<script src="./lodash.min.js"></script> <!-- lodash 全局脚本:文件位于 public/libs/(dev 由 vite 静态目录伺服,build 随 dist/libs 发布) -->
<script src="./libs/lodash.min.js"></script>
<script src="./libs/ztree/jquery.ztree.all.min.js"></script> <script src="./libs/ztree/jquery.ztree.all.min.js"></script>
</head> </head>
<body> <body>
+47
View File
@@ -95,6 +95,53 @@ class Base extends Abstract {
return this.postRequest({ url }); return this.postRequest({ url });
} }
// ===== 消息中心代理(§3.5:经后端签名代理 UserMsg,前端不直连)=====
/**
* 消息中心分页列表({total, list[]};元素含改写后的绝对 jumpUrl)
* @memberof Basic
*/
getMsgCenterList(params: PageParams) {
const url = path + "/msgCenter/list";
return this.getRequest<PageData>({ url, params });
}
/**
* 铃铛摘要:未读数 + 各应用待办角标
* @memberof Basic
*/
getMsgCenterSummary() {
const url = path + "/msgCenter/summary";
return this.getRequest<{ unreadCount: number; todos: { appKey: string; count: number }[] }>({ url });
}
/**
* WS 实时推送握手地址(UserMsg 一次性票据;url=null 表示未配置/不可达,走手动刷新兜底)
* @memberof Basic
*/
getMsgCenterWsTicket() {
const url = path + "/msgCenter/wsTicket";
return this.getRequest<{ url: string | null }>({ url });
}
/**
* 消息中心:已读某一条(按登录人代理)
* @memberof Basic
*/
readMsgCenter(msgId: number) {
const url = path + "/msgCenter/read";
return this.postRequest({ url, params: { msgId } });
}
/**
* 消息中心:全部已读
* @memberof Basic
*/
readMsgCenterAll() {
const url = path + "/msgCenter/readAll";
return this.postRequest({ url });
}
/** /**
* 修改密码 * 修改密码
* @memberof Basic * @memberof Basic
+157 -25
View File
@@ -27,7 +27,9 @@
<Poptip class="fl" popper-class="message-wrap reset-panel" :width="360" trigger="click" <Poptip class="fl" popper-class="message-wrap reset-panel" :width="360" trigger="click"
placement="bottom-end" v-model="isMsgShow" :transfer="true"> placement="bottom-end" v-model="isMsgShow" :transfer="true">
<div class="icon-box" v-wave> <div class="icon-box" v-wave>
<Badge :count="unreadCount" :offset="[2, 0]" overflow-count="99">
<SvgIcon name="header-2" color="#333333" /> <SvgIcon name="header-2" color="#333333" />
</Badge>
</div> </div>
<template #content> <template #content>
<h3 class="title">查看消息</h3> <h3 class="title">查看消息</h3>
@@ -38,15 +40,15 @@
<li class="fix"> <li class="fix">
<h4 :class="{ <h4 :class="{
'text-ellipsis': true, 'text-ellipsis': true,
read: item.read, read: item.isRead === 1,
}"> }">
<span class="app-name-box">{{ item.name }}</span> <span class="app-name-box">{{ item.appName || msgTypeLabel(item.msgType) }}</span>
<span class="content" :title="item.msg" <span class="content" :title="item.content"
@click="linkMessage(item.id, item.appPath, item.read)"> @click="onClickMsg(item)">
{{ item.msg }} {{ item.title }}:{{ item.content }}
</span> </span>
</h4> </h4>
<a href="javascript:;" @click="linkMessage(item.id, item.appPath, item.read)" <a v-if="item.jumpUrl" href="javascript:;" @click="onClickMsg(item)"
title="查看详情"> title="查看详情">
<SvgIcon name="arrow-right" color="#bbbbbb" /> <SvgIcon name="arrow-right" color="#bbbbbb" />
</a> </a>
@@ -288,6 +290,7 @@ import StatsBarModal from "@/components/StatsBarModal.vue";
import TeacherCopilotModal from "@/components/TeacherCopilotModal.vue"; import TeacherCopilotModal from "@/components/TeacherCopilotModal.vue";
import BaseApi from "@/api/BaseApi"; import BaseApi from "@/api/BaseApi";
import TablePage from "@/components/TablePage.vue"; import TablePage from "@/components/TablePage.vue";
import { Notice } from "view-ui-plus";
import { IframePageParmas, RoleInfo } from "@/types"; import { IframePageParmas, RoleInfo } from "@/types";
import { isEqual, orderBy } from "lodash"; import { isEqual, orderBy } from "lodash";
import { PageParams } from "@/types/Basics"; import { PageParams } from "@/types/Basics";
@@ -326,7 +329,96 @@ const isMsgShow = ref(false),
searchAppText = ref<string | null>(null), searchAppText = ref<string | null>(null),
wallpaperList = ref<any[]>([]), wallpaperList = ref<any[]>([]),
logoList = ref<any[]>([]), logoList = ref<any[]>([]),
userMsgList = ref<any[]>([]); userMsgList = ref<any[]>([]),
/** 未读消息数(msgCenter/summary 拉取 + WS newMessage 实时累加) */
unreadCount = ref(0);
// ===== 消息中心 WS 实时推送(UserMsg /ws/msg,一次性票据握手;断线 5s 重连换新票) =====
let msgWs: WebSocket | null = null;
let msgWsPingTimer: any = null;
let msgWsReconnectTimer: any = null;
let msgWsClosed = false;
async function loadSummary() {
try {
const summary = await BaseApi.getMsgCenterSummary();
unreadCount.value = (summary && summary.unreadCount) || 0;
} catch (e) {
/* 摘要失败不打扰页面 */
}
}
async function connectMsgWs() {
if (msgWsClosed) return;
let wsUrl: string | null = null;
try {
const res: any = await BaseApi.getMsgCenterWsTicket();
wsUrl = res && res.url;
} catch (e) {
/* 未登录/不可达:走兜底重连 */
}
// 票据不可得(UserMsg 重启中/未配置)也要保持重连节奏:服务恢复后自动续上
if (!wsUrl) {
if (!msgWsClosed) {
clearTimeout(msgWsReconnectTimer);
msgWsReconnectTimer = setTimeout(connectMsgWs, 5000);
}
return;
}
const ws = new WebSocket(wsUrl);
msgWs = ws;
ws.onopen = () => {
// 25s 心跳保活(服务端 90s 空闲回收)
msgWsPingTimer = setInterval(() => {
if (ws.readyState === WebSocket.OPEN) ws.send('{"type":"ping"}');
}, 25000);
};
ws.onmessage = ev => {
try {
const frame = JSON.parse(ev.data);
if (frame.type === "newMessage") onNewMessage(frame);
} catch (e) {
/* 非 JSON 帧忽略 */
}
};
ws.onclose = () => {
clearInterval(msgWsPingTimer);
msgWsPingTimer = null;
if (msgWs === ws) msgWs = null;
// 票据一次性:重连必换新票;退避上限 30s 防服务端长时间不可用时空转
if (!msgWsClosed) {
clearTimeout(msgWsReconnectTimer);
msgWsReconnectTimer = setTimeout(connectMsgWs, 5000);
}
};
}
function onNewMessage(frame: any) {
unreadCount.value += 1;
reloadMsg();
if (isMsgListShow.value) resetMsgPage();
Notice.info({
title: frame.title || "新消息",
desc: frame.content || "",
duration: 5,
});
}
function closeMsgWs() {
msgWsClosed = true;
clearTimeout(msgWsReconnectTimer);
msgWsReconnectTimer = null;
clearInterval(msgWsPingTimer);
msgWsPingTimer = null;
if (msgWs) {
try {
msgWs.close();
} catch (e) {
/* 已断开 */
}
msgWs = null;
}
}
const headerClass = computed(() => { const headerClass = computed(() => {
return { "default-header": true, "base-mask": route.name !== "index" }; return { "default-header": true, "base-mask": route.name !== "index" };
@@ -348,7 +440,7 @@ const userRole = computed(() => store.userRoleList);
const toggleSearch: any = inject("toggleSearch"); const toggleSearch: any = inject("toggleSearch");
const pageParams: PageParams = reactive({ page: 1, count: 10 }); const pageParams: PageParams = reactive({ page: 1, count: 10 });
const tableApi = (params: PageParams) => BaseApi.getMessagePageList(params); const tableApi = (params: PageParams) => BaseApi.getMsgCenterList(params);
const columns = ref<any[]>([ const columns = ref<any[]>([
{ {
type: "index", type: "index",
@@ -358,33 +450,63 @@ const columns = ref<any[]>([
}, },
{ {
title: "应用", title: "应用",
width: 150, width: 110,
tooltip: true,
align: "center", align: "center",
key: "name", render(h: any, params: any) {
return h("span", params.row.appName || msgTypeLabel(params.row.msgType));
},
}, },
{ {
title: "消息内容", title: "消息内容",
tooltip: true, render(h: any, params: any) {
key: "msg", const row = params.row;
return h("span", { attrs: { title: row.content } }, `${row.title || ""}:${row.content || ""}`);
},
}, },
{ {
title: "状态", title: "状态",
width: 100, width: 100,
render(h: any, params: any) { render(h: any, params: any) {
return h("span", params.row.read ? "已读" : "未读"); return h("span", params.row.isRead === 1 ? "已读" : "未读");
}, },
}, },
{ {
title: "日期", title: "日期",
align: "center", align: "center",
width: 200, width: 200,
key: "date", key: "sendTime",
},
{
title: "操作",
width: 90,
align: "center",
render(h: any, params: any) {
if (!params.row.jumpUrl) return h("span", "—");
return h(
"a",
{
attrs: { href: "javascript:;" },
on: {
click: () => {
if (params.row.isRead !== 1 && params.row.msgId) {
BaseApi.readMsgCenter(params.row.msgId);
params.row.isRead = 1;
unreadCount.value = Math.max(0, unreadCount.value - 1);
}
window.open(params.row.jumpUrl, "_blank");
},
},
},
"去处理"
);
},
}, },
]); ]);
onMounted(async () => { onMounted(async () => {
setTimeout(() => { setTimeout(() => {
reloadMsg(); reloadMsg();
loadSummary();
connectMsgWs();
// isWallpaperShow.value = true; // isWallpaperShow.value = true;
}, 200); }, 200);
loadLogoList(); loadLogoList();
@@ -395,6 +517,7 @@ onMounted(async () => {
}); });
onUnmounted(() => { onUnmounted(() => {
mittBus.off("searchReset"); mittBus.off("searchReset");
closeMsgWs();
}); });
watch(isSearching, val => { watch(isSearching, val => {
if (val) { if (val) {
@@ -407,13 +530,6 @@ watch(isSearching, val => {
watch(searchAppText, val => { watch(searchAppText, val => {
mittBus.emit("searchChange", val); mittBus.emit("searchChange", val);
}); });
function linkMessage(msgId: number, path: string, isread: boolean) {
if (!isread) BaseApi.readMessage(msgId);
var index = userMsgList.value.findIndex(x => x.id == msgId);
if (index !== -1) userMsgList.value[index].read = true;
window.open(path);
}
function getIsCheckRoles(item: RoleInfo) { function getIsCheckRoles(item: RoleInfo) {
return isEqual(item, store.curRoleInfo); return isEqual(item, store.curRoleInfo);
} }
@@ -438,14 +554,30 @@ function onUserinfoClickRoles() {
} }
async function readMsgAll(type: 1 | 2) { async function readMsgAll(type: 1 | 2) {
await BaseApi.readMessageAll(); await BaseApi.readMsgCenterAll();
await reloadMsg(); await reloadMsg();
unreadCount.value = 0;
if (type == 2) resetMsgPage(); if (type == 2) resetMsgPage();
} }
async function reloadMsg() { async function reloadMsg() {
const result = await BaseApi.getMessageList(); const result: any = await BaseApi.getMsgCenterList({ page: 1, count: 10 });
userMsgList.value = result.list; userMsgList.value = result.list || [];
}
/** 消息类型名(UserMsg msgType:0系统通知/1业务提醒/2审批待办) */
function msgTypeLabel(msgType: number) {
return { 0: "系统通知", 1: "业务提醒", 2: "审批待办" }[msgType as 0 | 1 | 2] || "系统通知";
}
/** 点击消息:未读先标读;配了 jumpUrl(如 flow.task 待办)新窗口打开落地页 */
async function onClickMsg(item: any) {
if (item.isRead !== 1 && item.msgId) {
await BaseApi.readMsgCenter(item.msgId);
item.isRead = 1;
unreadCount.value = Math.max(0, unreadCount.value - 1);
}
if (item.jumpUrl) window.open(item.jumpUrl, "_blank");
} }
function resetMsgPage() { function resetMsgPage() {