feat(viewer): embed carousel iframe with visibility pause
P4b Task 4:宿主 loader 以 iframe 载入的轮播页(/embed/:slotToken,裸布局)。 - src/embed/feed.ts:纯函数集——A22 旧响应裁决(dispatch seq + configVersion 双闸:过期/回看丢弃、等值差分合并、升值全量重置)、照片队列差分(新照片 追加队尾、缺席淘汰、thumb 签名刷新)、interval/高度夹取、轮询退避; - src/embed/useEmbedFeed.ts:取数编排(If-None-Match → 304 零处理)、轮询 (查询 interval 覆盖 → EMBED_POLL_INTERVAL_MS,连续 5 失败 ×5 退避,成功 归零;404/410 静默 collapse 隐藏自身)、A23 不可见暂停(document 隐藏 + IntersectionObserver 滚出视口 + 本地收起;恢复立即校准)、轮播 intervalMs 切换;__embedPollMs e2e 注入点; - src/embed/postMessage.ts:上行 resize/collapse(referrer origin 收敛,缺失 退 '*'——载荷无敏感数据,宿主侧 loader source+origin 双校验)、下行 expand (event.source === window.parent 白名单); - EmbedPage.vue:交叉淡入淡出(仅 thumb 小图省流量)、点击 window.open 单图 深链(noopener)、计数圆点、「照片即将上线」空态卡、×收起;lang 查询 (auto→相册 defaultLocale)驱动嵌入词条子集; - api client:fetchPublicEmbedSlot(304/ETag 分支,不走 apiRequest); - e2e:宿主夹具页 public/__test__/embed-host.html(仅测试资产)+ embed.spec 7 用例(轮换/新标签深链/收起记忆/窄屏 sm/轮询增量/换绑重置/空态/幽灵槽); helpers 增展示位 admin API 种子 + flushOutbox; - vitest 18 用例(裁决矩阵/队列差分/夹取/退避/304/可见性状态机)。 配套修正:api CORS exposedHeaders ETag(跨源浏览器可读,304 语义成立); contracts 新增浏览器安全子路径 ./constants(根出口 re-export internal-sync 的 node:crypto 会打进浏览器包);eslint ignore embed-loader 产物拷贝 (Task 3 起 viewer lint 红,先修)。 Co-Authored-By: Claude Code <noreply@anthropic.com>
This commit is contained in:
@@ -19,6 +19,7 @@ import {
|
||||
signSyncBody,
|
||||
} from '@photo/contracts';
|
||||
import { deliverPendingOnce } from '../../../services/sync/src/sender';
|
||||
import { seedAdmin } from '../../../services/api/src/scripts/seed-admin';
|
||||
|
||||
// 仓库根 .env 唯一来源(同 services/api test/load-env.ts 约定)。必须在
|
||||
// PrismaClient / createStorageFromEnv 构造前执行——两者均在首次查询/调用时读 env。
|
||||
@@ -235,13 +236,84 @@ export async function flushSync(albumId: string): Promise<void> {
|
||||
`flushSync bootstrap 失败(${bootstrap.status}):${(await bootstrap.text()).slice(0, 300)}`,
|
||||
);
|
||||
}
|
||||
await flushOutbox();
|
||||
}
|
||||
|
||||
/** 仅排空 outbox(P4b Task 4 embed e2e):slot.updated 事件不随相册 bootstrap
|
||||
* 走(bootstrap 清单恒不含 slot-state),展示位创建/绑定的同步须单独排空。 */
|
||||
export async function flushOutbox(): Promise<void> {
|
||||
await deliverPendingOnce({
|
||||
prisma,
|
||||
ovApiUrl: process.env.OV_API_URL ?? 'http://127.0.0.1:8081',
|
||||
internalKey,
|
||||
internalKey: process.env.SYNC_INTERNAL_KEY ?? 'dev-sync-secret-change-me',
|
||||
});
|
||||
}
|
||||
|
||||
// ── P4b Task 4 展示位种子(经 cn admin API 真实路径,非直插行)──
|
||||
|
||||
const ADMIN_ACCOUNT = process.env.ADMIN_ACCOUNT ?? 'admin';
|
||||
const ADMIN_PASSWORD = process.env.ADMIN_PASSWORD ?? 'admin-secret-change-me';
|
||||
|
||||
const seededSlotIds: string[] = [];
|
||||
let adminTokenPromise: Promise<string> | null = null;
|
||||
|
||||
/** seeded admin 幂等 + 登录(journey.spec 同款;会话进程内复用)。 */
|
||||
async function loginAdmin(): Promise<string> {
|
||||
if (adminTokenPromise === null) {
|
||||
adminTokenPromise = (async () => {
|
||||
await seedAdmin(prisma, ADMIN_ACCOUNT, ADMIN_PASSWORD);
|
||||
const res = await fetch(
|
||||
`${(process.env.CN_API_URL ?? 'http://127.0.0.1:8080').replace(/\/+$/, '')}/v1/auth/password`,
|
||||
{
|
||||
method: 'POST',
|
||||
headers: { 'content-type': 'application/json' },
|
||||
body: JSON.stringify({ account: ADMIN_ACCOUNT, password: ADMIN_PASSWORD }),
|
||||
},
|
||||
);
|
||||
if (!res.ok) {
|
||||
throw new Error(`embed seed 登录失败(${res.status})`);
|
||||
}
|
||||
return ((await res.json()) as { sessionToken: string }).sessionToken;
|
||||
})();
|
||||
}
|
||||
return adminTokenPromise;
|
||||
}
|
||||
|
||||
/** 经 cn admin API 创建展示位(未绑定态;settings 缺省),登记待清理。 */
|
||||
export async function createEmbedSlot(name: string): Promise<{ id: string; token: string }> {
|
||||
const token = await loginAdmin();
|
||||
const res = await fetch(
|
||||
`${(process.env.CN_API_URL ?? 'http://127.0.0.1:8080').replace(/\/+$/, '')}/v1/admin/embed-slots`,
|
||||
{
|
||||
method: 'POST',
|
||||
headers: { 'content-type': 'application/json', authorization: `Bearer ${token}` },
|
||||
body: JSON.stringify({ name }),
|
||||
},
|
||||
);
|
||||
if (!res.ok) {
|
||||
throw new Error(`createEmbedSlot 失败(${res.status}):${(await res.text()).slice(0, 300)}`);
|
||||
}
|
||||
const body = (await res.json()) as { id: string; publicToken: string };
|
||||
seededSlotIds.push(body.id);
|
||||
return { id: body.id, token: body.publicToken };
|
||||
}
|
||||
|
||||
/** 经 cn admin API 更新展示位(绑定/换绑相册、启停、设置——body 直传契约形状)。 */
|
||||
export async function updateEmbedSlot(id: string, body: Record<string, unknown>): Promise<void> {
|
||||
const token = await loginAdmin();
|
||||
const res = await fetch(
|
||||
`${(process.env.CN_API_URL ?? 'http://127.0.0.1:8080').replace(/\/+$/, '')}/v1/admin/embed-slots/${id}`,
|
||||
{
|
||||
method: 'PATCH',
|
||||
headers: { 'content-type': 'application/json', authorization: `Bearer ${token}` },
|
||||
body: JSON.stringify(body),
|
||||
},
|
||||
);
|
||||
if (!res.ok) {
|
||||
throw new Error(`updateEmbedSlot 失败(${res.status}):${(await res.text()).slice(0, 300)}`);
|
||||
}
|
||||
}
|
||||
|
||||
/** 模拟已分享深链的照片下线(Task 8 e2e):软删(visibility=deleted +
|
||||
* entityVersion 自增)——硬删会让 cn 行缺席、bootstrap 快照无从发墓碑,ov 副本
|
||||
* 将永远留着旧发布行;软删 + flushSync 让 photo.deleted 事件走真实管线撤下。
|
||||
@@ -260,6 +332,16 @@ export async function deleteSeededPhoto(photoId: string): Promise<void> {
|
||||
* dev 桶内残余有界(同 api e2e 约定)。 */
|
||||
export async function cleanupSeededAlbums(): Promise<void> {
|
||||
try {
|
||||
// 展示位种子(P4b):绑定态 slot.updated 行随相册圈定(albumId 在种子相册集)
|
||||
// 已被下方 outbox 清理覆盖;未绑定创建行以 albumId='' 占位——仅清「未投递」
|
||||
// 残留(已投递行 inert;未投递残留会污染后续 deliverPendingOnce 排空判定)。
|
||||
if (seededSlotIds.length > 0) {
|
||||
await prisma.outbox_events.deleteMany({
|
||||
where: { type: 'slot.updated', albumId: '', deliveredAt: null },
|
||||
});
|
||||
await prisma.embed_slots.deleteMany({ where: { id: { in: seededSlotIds } } });
|
||||
seededSlotIds.length = 0;
|
||||
}
|
||||
if (seededAlbumIds.length > 0) {
|
||||
const photos = await prisma.photos.findMany({
|
||||
where: { albumId: { in: seededAlbumIds } },
|
||||
|
||||
Reference in New Issue
Block a user