工程 · 后端实施

前端已经就绪，
接下来是后端。

这套前台已经把“接口该返回什么”写死了——所有内容目前在 data.js 与 content*.js 里。后端要做的第一步不是写业务，而是把这些 JSON 搬进数据库、用接口暴露出来。

下载完整手册（Markdown）

{/* 一句话结论 */}

结论

做「一个内容接口 + 一个管理后台 + 三个外部集成」，不要做一整套 CMS。

第一周把静态前台跑成动态站；第二周让运营能不发电就改内容；第三周接预约与支付；之后才是公众号同步与活动抓取。每一步都能独立上线、独立回退。

{/* 接口契约 */}

{api.map(([m, u, d], i) => (

{m} {u} {d}

))}

价格一律用「分」的整数传输，展示文案由后端生成 —— 改价只改数据库一处，前台不允许硬编码金额。

{/* 数据模型 */}

{`create table courses ( id bigserial primary key, slug text unique not null, level text not null, -- l1 | l2 | l3 status text default 'draft', -- open | locked | soon price_cents int, -- null = 待定 bundle_price_cents int, -- 职业套餐 points jsonb default '[]', sort int default 0 ); create table events ( id bigserial primary key, kind text not null, -- workshop | gathering | public state text not null, -- upcoming | past | archived start_date date not null, city text, venue text, seats int, seats_left int, photos jsonb default '[]', -- 活动后可补传 source_url text, -- 公众号原文 wx_article_id text, -- 幂等键 published_at timestamptz ); create index on events (state, start_date desc);`}

{`create table posts ( slug text unique not null, wx_article_id text unique, title text not null, body jsonb not null, -- 块结构正文 category text not null, status text default 'draft', -- draft|review|published source_url text, published_at timestamptz ); create table admins ( email text unique not null, password_hash text not null, -- argon2id role text default 'editor', -- owner|admin|editor totp_secret text ); create table audit_logs ( -- 一切写操作留痕 actor_id bigint, action text, target_table text, target_id bigint, before jsonb, after jsonb, ip inet, created_at timestamptz default now() );`}

{/* 三个集成 */}

{[ ['公众号文章同步', 'webhook 验签 → 抓取 → 清洗 → 图片转存 → 入库草稿 → 后台待审。用 wx_article_id 做幂等，微信会重试推送。'], ['活动 AI 抽取', '命中关键词入队 → 抓正文 → LLM 输出严格 JSON（含置信度）→ 运营核对上架。低置信字段前台显示「待公布」，不要猜。'], ['关注即登录', '订阅号没有 OAuth。带参二维码 + subscribe 事件 + 轮询命中，二维码 5 分钟过期要能自动刷新。'], ].map(([t, d], i) => (

0{i + 1}

{t}

{d}

))}

{`① 定时 / 手动触发 → 拉取最近推文 ② 标题摘要命中 [报名|排期|工作坊|公开课|督导] → 入队 ③ 抓正文 → 清洗 → 图片转存对象存储 ④ LLM 输出严格 JSON（function calling / JSON Schema）： { title, startDate, endDate, city, venue, seats, feeText, deadline, points[3], confidence{} } ⑤ 写 events（state=upcoming），运营逐字段核对 ⑥ 确认上架 → published_at ⑦ 定时任务：start_date 过后自动 state=past`}

{/* 后台 */}

省掉两周

后台界面
已经画好了。

项目里的 admin.jsx 就是给后端用的界面规格：看板、文章同步、活动抓取、内容库、课程报名、名录、会员、版本、权限。

{ const b = [...document.querySelectorAll('button')].find((x) => x.textContent === '运营后台'); if (b) b.click(); }} arw>打开运营后台原型

0{i + 1}
{a}
{b}

{/* 路线 */}

{/* 底线 */}

三条底线

{[ ['前台永远不白屏', '所有 GET 接口在构建时预渲染快照；运行时接口挂了回退快照。这是老站留下的教训。'], ['写操作全留痕', 'audit_logs 记录 who / what / before / after。内容错了能回滚，人传错了能查到。'], ['价格只有一处真相', '前端不允许硬编码金额。content-v3.js 里的 12800 必须删掉，改由接口下发。'], ].map(([t, d], i) => (

0{i + 1}

{t}

{d}

))}

{/* 上线前必换 */}

{[ ['3 场「即将到来」的活动', '2026 春季班 / 杭州督导日 / 线上公开课 —— 日期与人名均为示例', 'events'], ['客服微信 / 付款链接 / 公众号二维码', 'qhht_service、#pay 都是占位', 'site_settings'], ['两张 AI 生成的人物照', 'assets/portrait-teacher*.jpg 不是真实学员，对外宣传需替换为有授权照片', 'media'], ].map(([a, b, c], i) => (

{a}

{b}

{c}

))}

); } Object.assign(window, { BackendPage, BCode, BStep });

{t}

前端已经就绪，接下来是后端。

{t}

后台界面已经画好了。

{a}

{t}

前端已经就绪，
接下来是后端。

后台界面
已经画好了。