用 Cloudflare Pages 做一套静态页 + 评论系统(方案 A · Vue3 版)

这一页是 Vue 3 单页(浏览器全局构建,无编译步骤):模板即 HTML,{{ }} 插值自动转义防 XSS;评论数据由 fetch /api/comments 拉取——API 就是同项目 functions/ 目录里的文件,文件名即路由,同源无跨域。

链路:提交评论 → Turnstile 判真人 → Functions 服务端验签(success + action + 同源域名)→ 写入 D1(状态 pending)→ 邮件通知管理员 → 审核页点"通过" → 出现在下面的公开列表。审核前只有提交者本人用邮箱能查到。

和方案 B(Workers+assets,demo.vasks.workers.dev/post)读写同一个 D1 库,两边的评论互通。

评论({{ total }})

加载中…

{{ msg }}

我的待审核评论

{{ c.nickname || '匿名' }}待审核,仅自己可见

{{ c.content }}

没有查到该邮箱下的待审评论