技术选型
本来是打算使用服务器部署网站的,于是购买了 Vultr 的云服务器,买了一个低配版 新加坡的VPS。并且花了大价钱买了一个付费的游戏站模板,成功部署并上线之后。也许是服务器的配置低,也许是服务器地处国外,输入网址后,刚开始几次打不开,连续访问多次才打开,但是过了一会又打不开了。无奈,这条路走不通,此时已经砸进去 1000 多块,但也只能放弃了这个死胡同。
道路二:此时为了不再花冤枉钱,决定查询有什么省钱的方法,这时就找到了赛博菩萨 cloudflare,通过 cloudflare 可以免费部署网站,但是cloudflare 上对于网站的技术选型有一些要求,很多网站框架无法在这里部署,就比如我之前购买的游戏站模板,就无法在cloudflare上运行,于是需要寻找能够契合 cloudflare 的网站框架。很多 AI 工具,比如 DeepSeek、豆包、智谱都给我推荐的是 Astro。于是就上手干吧。
开始建站
接下来就是正式上手了,在 GitHub 上新建一个仓库,在 CloudFlare 注册账号,然后在 CloudFlare 上导入 GitHub 里创建好的仓库。不过仓库目前还是空的,所以需要先写代码。这个就交给 AI 吧,提示词走起:
我要构建一个面向全球英文用户的 HTML5 游戏门户,请你设计完整、可执行、经过事实核验的实现方案。
工作规则
- 先复述需求,再提出剩余问题;如无阻塞问题,明确列出假设。
- 重大结论必须联网搜索验证,优先依据官方文档、平台条款、真实响应头、真实数据和实际构建/浏览器测试。
- 禁止猜测、胡编乱造、把推测写成事实、引用过期额度或过期配置。
- 输出必须区分:当前实测事实、官方文档结论、工程建议、仍未验证事项。
- 标明关键来源链接和检索日期。
已确认决策
- 品牌名:
I Love Free Games- 生产域名:
https://games.ilovefree.com/- 目标市场:全球英文用户
- 游戏、模板、UI、内容生成、人工审核预算和时间不设限
- 第一版不强求深度横屏/竖屏优化,但手机浏览器基础响应式和 iframe 基础可用必须保证
- 路由固定:
- 游戏页:
/game/{slug}/- 分类页:
/category/{slug}/- 搜索页:
/search/- 技术栈目标:
- Astro 最新稳定版,纯静态输出
- TypeScript
- Astro Content Layer API + Zod
- Cloudflare Workers Static Assets
- GitHub Actions + Wrangler 部署
- Pagefind 静态搜索
- remark-directive + 自定义 Remark 插件
- Gemini 2.5 Flash Batch API 辅助生成内容,需核验当前官方支持、价格、配额和批处理格式
- 第一版不需要:
- SSR
- 用户系统
- 登录
- 数据库
- Cloudflare KV/D1
- Supabase
- 后台管理系统
- 运行时搜索 API
- Pages Functions
当前域名实测状态
我已实测:
games.ilovefree.com当前通过 Cloudflare DoH 查询 A/AAAA 均返回 NXDOMAIN。ilovefree.com的 SOA 显示权威 NS 在 Cloudflare 下。- 结论:顶级域名 DNS 已接入 Cloudflare,但
games子域名当前没有公开解析记录。- 方案中必须包含创建/绑定
games.ilovefree.comDNS 与 Cloudflare Workers 服务的上线步骤。真实的游戏数据
我会提供真实
games.json。请基于附件实际解析,不要按顶层数组假设。已实测结构:
- 文件大小约 7.1MB。
- 顶层对象包含:
inputsortsegments- 当前只有 1 个 segment:
Specially for yousegments[0].count = 2268segments[0].hits实际包含 2,268 个游戏对象id无重复slug无重复id/slug/title/description/howToPlayText/gameURL/embed/images无缺失- 实际字段集合:
idslugtitledescriptionhowToPlayTextgameURLgenrestagsimagesvideosmobileReadygenderinGamePurchasessupportedLanguagesscreenOrientationembed- 文件中不存在
imageSrc或imageSrcSquare,不要假设这些字段存在。images当前每条记录都有 2 张。- genres 实测 188 个唯一值、8,365 次出现,不要硬编码 97。
- tags 实测 387 个唯一值。
- 63 个游戏没有 genres,34 个没有 tags,需要导入状态处理。
- 2,264 个游戏声明支持
en-US。screenOrientation:
- horizontal only:952
- vertical only:580
- both:735
- both false:1
inGamePurchases:
- No:1,929
- Yes:339
- 原始 description 粗略分词:
- 1,458 条少于 100 词
- 仅 23 条超过 500 词
embed是完整 iframe HTMLembed的allow属性非常宽,包含 camera、microphone、geolocation、payment、storage-access、browsing-topics 等权限。必须设计既安全又不破坏游戏的权限策略,并用真实游戏测试;不能盲目保留,也不能未验证就删除。- 第一条真实
gameURL已实测 HTTP 200,响应包含content-security-policy: frame-ancestors *和server: cloudflare。- 该测试只覆盖一个样本,不能推断 2,268 款全部可玩,必须设计批量 HTTP 检查和浏览器抽检。
数据管线要求
- 原始导出可放在
src/data/ilovefree-export.json。- 必须先做敏感信息扫描,避免提交 Partner 密钥、后台 token 或非公开凭证。
- 编写导入脚本,从
segments[*].hits[*]扁平化提取游戏,不要按顶层数组解析。- 构建校验必须包含:
- id/slug 唯一
- slug 适合 URL
- 必填字段存在
gameURL与embed.src一致gameURL为 HTTPS- 图片为 HTTPS 且属于允许资源域
- genres/tags 去重
- orientation/mobileReady/language 枚举合法
- 构建错误输出具体游戏 id、slug 和失败原因
- 自动生成
src/data/ilovefree-genres.json:
- 不提交 Git
.gitignore忽略- prebuild/postinstall 自动生成
- 稳定排序
- 记录原始 genre、slug、游戏数、核心/聚合/仅标签级别
- 游戏发布状态:
draftneeds-human-reviewreadypublishedthinbrokenremoved- 未经审核或内容不足的游戏不得进入 sitemap。
页面与内容
游戏页
- 路由:
/game/{slug}/- H1 为游戏标题
- 每页有唯一 title、meta description、canonical
- 展示游戏主图、iframe 播放区、分类、标签、相关游戏
- 游戏简介目标 500-800 英文词,Gemini 辅助生成后人工审核
- How to Play 目标 200-300 英文词,基于
howToPlayText扩写,不得编造操作- AI 内容必须基于导出的真实 title、description、howToPlayText、genres、tags、controls、orientation、languages、platforms 等字段;源数据不足则标记
needs-human-review,不得硬凑mobileReady与screenOrientation用于设备和方向提示- 默认 direct iframe,不为每个游戏生成
/embed/{slug}/- wrapper 仅用于特殊 provider 或 direct 失败后备,且必须
noindex,nofollow分类页
- 路由:
/category/{slug}/- 从 188 个真实 genre 中设计 10-15 个高频核心分类和 5-8 个聚合分类
- 不允许 188 个 genre 全部生成可索引分类页
- 核心分类页需要 500-800 词人工审核后的策展内容
- 低频 genre 可作为标签或客户端筛选,不生成薄分类页
- 分类页必须说明玩法、适合人群、控制方式、代表游戏和选择标准,不能是模板化同义替换
- 筛选、排序、分页必须有 canonical/noindex 策略,避免重复内容和爬虫陷阱
文章页
- 15-20 篇英文玩法指南,每篇 1000 词以上
- 存放于
src/content/articles/- frontmatter 包含
title/description/genres/publishedAt/updatedAtgenres必须来自真实生成的 genre 集合,Zod 严格校验- 正文中使用:
::game-card{genre="Action" count="4"}- 卡片数量:
- 1000-1500 词:3
- 1500-2000 词:4
- 2000 词以上:5
- 优先按第一个 genre 筛选,不足时使用全部 genres 的并集
- 卡片展示缩略图、标题、简短描述、Play Now
- 推荐卡片数据优先使用构建期静态分片,不默认引入运行时 API
搜索
- 使用 Pagefind
- 索引游戏页、核心分类页、文章页
/search/为noindex, follow,不进 sitemap,不建议 robots.txt disallow;请按 Google 当前文档核验- 评估 Pagefind 索引体积和移动端加载策略
- 如建议
@stanniel/astro-pagefind,请核验维护状态和 Astro 当前兼容性;否则使用 Pagefind CLISEO 与发布策略
- 全站静态预渲染,游戏列表和分类入口必须存在于 HTML,不能只靠客户端渲染
- 可索引页面有唯一 H1、title、description、canonical、语义化结构和内部链接
- sitemap 只包含首页、核心分类页、聚合分类页、已发布高质量游戏页、文章页和必要合规页
- 不包含搜索页、wrapper、thin、broken、draft、无价值标签页、排序或筛选参数
- 结构化数据只允许基于真实数据,可评估
WebSite、BreadcrumbList、VideoGame、Article- 禁止虚假
AggregateRating、Review、VideoObject、评分、评论数或发布信息- 最终目标是 2,268 款全部发布,但应设计分批上线:
- 20-50 款验证技术、SEO、iframe
- 150-300 款验证内容质量
- 500-800 款观察 Search Console
- 1,200-2,000 款继续扩展
- 最后扩展到 2,268 款
- 请核验 Google 当前关于 scaled content abuse、thin affiliate content、site quality 的官方政策
- AI 内容需要自动检查长度、语言、禁止短语、重复句式、事实一致性和 HTML 安全
- 人工审核至少抽检 10%,分类页和文章必须人工审核后发布
Cloudflare 与部署
- 架构:Astro static build -> Pagefind -> Wrangler deploy -> Cloudflare Workers Static Assets
- 不使用 Pages Functions;如确需动态能力,必须单独论证,并优先用静态 JSON chunk 替代
- 核验当前 Cloudflare 官方限制:
- Workers Free 请求数
- Static Assets 免费/付费文件数
- 单文件大小
_headers规则数_redirects规则数- Workers Static Assets 与 Pages 差异
- HTML 缓存:
- 初期:
public, max-age=0, must-revalidate- 稳定后:
public, s-maxage=300, stale-while-revalidate=86400- 带 hash 的
/_astro/*可评估一年 immutable/pagefind/*不能盲目 immutable,因为可能同时有带 hash fragment 和不带 hash 入口文件- workers.dev 预览必须 noindex
- 生产 canonical 指向
https://games.ilovefree.com- 需要配置安全响应头和 CSP
- 需要核验以下 Astro 配置是否真实存在且适用:
NODE_OPTIONS=--max-old-space-size=8192deferRendercollectionStorage: 'chunked'CI/CD 与验收
GitHub Actions 至少包含:
- 依赖安装和 lockfile 校验
- genre 自动生成
- schema 校验
- 敏感信息扫描
astro checkastro build- Pagefind 构建
- sitemap/noindex/canonical 校验
- 死链校验
- 构建体积、文件数、最大单文件检查
- AI 内容质量检查
- Playwright iframe 抽检
- preview 部署
- 手动批准后 production 部署
请输出完整方案,包含:
- 需求复述和剩余问题
- 架构图
- 技术选型对比和结论
- 项目目录结构
package.jsonastro.config.mjs- Wrangler 当前推荐配置
- Content Collections schema
- wrapper 导入脚本
- genre 生成与分类映射
- iframe 解析与安全渲染
- 首页、游戏页、分类页、搜索页、文章页实现
- remark-directive 插件和游戏卡片挂载
- Gemini Batch 脚本、Prompt、审核与重试
- SEO、sitemap、robots、JSON-LD
- 用户协议和隐私政策页面
_headers、_redirects- GitHub Actions workflow
- Cloudflare DNS/部署步骤
- 构建优化和性能预算
- 移动端基础适配
- Playwright 验收清单
- 分阶段上线到 2,268 款的计划
- 风险清单和缓解措施
- 所有需要创建的文件及作用
- 最终验收标准