技术架构

系统架构全景

Nuxt 4 PPR × Cloudflare Edge × 六维 SEO 工程化

渲染策略：PPR 混合渲染

按路由精细控制渲染模式，兼顾 SEO 与动态交互。

文章 / 分类页

SSG

·构建时预渲染为静态 HTML
·CDN 直接命中，TTFB < 50ms
·Nuxt Content queryCollection
·路由：/articles/:slug, /categories/:slug

搜索 / 看板页

SSR

·每次请求动态渲染
·依赖实时数据库查询
·routeRules: { ssr: true }
·路由：/search, /dashboard, /landing

登录 / 用户页

SPA

·纯客户端渲染
·无需 SEO 索引
·server: false 组件
·路由：/login, /about

存储架构：双驱动 Repository Pattern

单一 Drizzle Schema，通过 STORAGE_DRIVER 环境变量切换驱动，生产与本地完全隔离。

Cloudflare D1 + KV

生产 · 已部署

·D1：SQLite-on-edge，全球分布
·KV：SEO 检测缓存、行为事件存储
·STORAGE_DRIVER=cf（wrangler.toml）
·server/repositories/*.cf.ts

SQLite 或 PostgreSQL（二选一）

本地开发

·SQLite：.dev.db，STORAGE_DRIVER=sqlite，零配置
·PostgreSQL：docker-compose，STORAGE_DRIVER=node
·两种驱动均实现相同 Repository 接口
·server/repositories/*.node.ts

数据表： users · sms_codes · refresh_tokens · comments · bookmarks · reading_history · search_index · seo_checks · behavior_events · category_subscriptions

认证体系：短信免密 + 双 JWT

阿里云 SMS 验证码

登录流程

·POST /api/auth/send-code → 阿里云 SMS
·6位验证码，5分钟有效
·POST /api/auth/verify → 校验 + 签发 JWT
·首次登录自动注册

双 JWT 无感刷新

令牌策略

·Access Token：15分钟，Bearer Header
·Refresh Token：7天，httpOnly Cookie
·自动续期：401 时静默刷新
·JTI 黑名单防重放

全文搜索：自建 TF-IDF 倒排索引

无需 Elasticsearch，构建时生成索引写入 D1，运行时纯 SQL 检索。

索引生成

构建期

·遍历所有 Markdown 文章
·中文分词 + 停用词过滤
·计算 TF-IDF 权重
·批量写入 search_index 表

检索逻辑

运行期

·GET /api/search?q=关键词
·分词后查 search_index
·按 tfidf_score 排序
·返回 article_slug 列表

能力边界

特性

·支持多词 AND 检索
·无外部依赖，边缘可运行
·索引随构建自动更新
·当前索引：~9900 词条

六维 SEO 工程化

PageSpeed Insights

① 技术SEO

·LCP / INP / CLS / FCP / TTFB
·Mobile + Desktop 双策略
·SSE 流式推送检测进度
·结果持久化至 D1

元数据完整性

② 内容SEO

·title / description / canonical
·JSON-LD 结构化数据
·Organization + WebSite Schema
·Open Graph / Twitter Card

构建时静态检查

③ 工程化

·vite-plugin-seo-check
·titleSlug 唯一性（error）
·meta description 完整性（error）
·正文字数 ≥ 300（warn）

AI 爬虫优化

④ AEO

·robots.txt 允许 GPTBot / anthropic-ai
·PerplexityBot / OAI-SearchBot
·Sitemap 51 个 URL
·JSON-LD 结构化问答数据

真实用户监控

⑤ RUM

·web-vitals.client.ts 采集
·LCP / INP / CLS / FCP / TTFB
·POST /api/metrics/vitals
·KV 存储 7 天滚动窗口

GitHub Actions 定时生成

⑥ 内容自动化

·cron 每7天触发，支持手动 dispatch
·调用外部 AI 接口生成长尾词标题
·按分类主题生成 Markdown 文章
·自动 PR → squash merge → CF Pages 重新构建

实时 SEO 看板

看板

·历史趋势评级色块时间线
·All / Mobile / Desktop 切换
·内容SEO + AEO 自检状态
·默认展示最近一次检测

部署架构：双平台单配置

Cloudflare Pages + Workers

已部署 · 生产

·BUILD_TARGET=cf nuxt build --preset=cloudflare-pages
·_routes.json 精细路由控制
·D1 绑定 + KV 命名空间
·全球 CDN 边缘节点

VPS Docker（未上线）

备用配置

·BUILD_TARGET=node nuxt build
·docker-compose + nginx 反代
·PostgreSQL + Redis 容器
·可部署至 Zeabur 或自建 VPS