博客

  • 出海游戏站第一式

    技术选型

    本来是打算使用服务器部署网站的,于是购买了 Vultr 的云服务器,买了一个低配版 新加坡的VPS。并且花了大价钱买了一个付费的游戏站模板,成功部署并上线之后。也许是服务器的配置低,也许是服务器地处国外,输入网址后,刚开始几次打不开,连续访问多次才打开,但是过了一会又打不开了。无奈,这条路走不通,此时已经砸进去 1000 多块,但也只能放弃了这个死胡同。

    道路二:此时为了不再花冤枉钱,决定查询有什么省钱的方法,这时就找到了赛博菩萨 cloudflare,通过 cloudflare 可以免费部署网站,但是cloudflare 上对于网站的技术选型有一些要求,很多网站框架无法在这里部署,就比如我之前购买的游戏站模板,就无法在cloudflare上运行,于是需要寻找能够契合 cloudflare 的网站框架。很多 AI 工具,比如 DeepSeek、豆包、智谱都给我推荐的是 Astro。于是就上手干吧。

    开始建站

    接下来就是正式上手了,在 GitHub 上新建一个仓库,在 CloudFlare 注册账号,然后在 CloudFlare 上导入 GitHub 里创建好的仓库。不过仓库目前还是空的,所以需要先写代码。这个就交给 AI 吧,提示词走起:

    我要构建一个面向全球英文用户的 HTML5 游戏门户,请你设计完整、可执行、经过事实核验的实现方案。

    工作规则

    1. 先复述需求,再提出剩余问题;如无阻塞问题,明确列出假设。
    2. 重大结论必须联网搜索验证,优先依据官方文档、平台条款、真实响应头、真实数据和实际构建/浏览器测试。
    3. 禁止猜测、胡编乱造、把推测写成事实、引用过期额度或过期配置。
    4. 输出必须区分:当前实测事实、官方文档结论、工程建议、仍未验证事项。
    5. 标明关键来源链接和检索日期。

    已确认决策

    • 品牌名: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.com DNS 与 Cloudflare Workers 服务的上线步骤。

    真实的游戏数据

    我会提供真实 games.json。请基于附件实际解析,不要按顶层数组假设。

    已实测结构:

    • 文件大小约 7.1MB。
    • 顶层对象包含:
      • input
      • sort
      • segments
    • 当前只有 1 个 segment:Specially for you
    • segments[0].count = 2268
    • segments[0].hits 实际包含 2,268 个游戏对象
    • id 无重复
    • slug 无重复
    • id/slug/title/description/howToPlayText/gameURL/embed/images 无缺失
    • 实际字段集合:
      • id
      • slug
      • title
      • description
      • howToPlayText
      • gameURL
      • genres
      • tags
      • images
      • videos
      • mobileReady
      • gender
      • inGamePurchases
      • supportedLanguages
      • screenOrientation
      • embed
    • 文件中不存在 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 HTML
    • embed 的 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、游戏数、核心/聚合/仅标签级别
    • 游戏发布状态:
      • draft
      • needs-human-review
      • ready
      • published
      • thin
      • broken
      • removed
    • 未经审核或内容不足的游戏不得进入 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/updatedAt
    • genres 必须来自真实生成的 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 CLI

    SEO 与发布策略

    • 全站静态预渲染,游戏列表和分类入口必须存在于 HTML,不能只靠客户端渲染
    • 可索引页面有唯一 H1、title、description、canonical、语义化结构和内部链接
    • sitemap 只包含首页、核心分类页、聚合分类页、已发布高质量游戏页、文章页和必要合规页
    • 不包含搜索页、wrapper、thin、broken、draft、无价值标签页、排序或筛选参数
    • 结构化数据只允许基于真实数据,可评估 WebSite、BreadcrumbList、VideoGame、Article
    • 禁止虚假 AggregateRating、Review、VideoObject、评分、评论数或发布信息
    • 最终目标是 2,268 款全部发布,但应设计分批上线:
      1. 20-50 款验证技术、SEO、iframe
      2. 150-300 款验证内容质量
      3. 500-800 款观察 Search Console
      4. 1,200-2,000 款继续扩展
      5. 最后扩展到 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=8192
      • deferRender
      • collectionStorage: 'chunked'

    CI/CD 与验收

    GitHub Actions 至少包含:

    1. 依赖安装和 lockfile 校验
    2. genre 自动生成
    3. schema 校验
    4. 敏感信息扫描
    5. astro check
    6. astro build
    7. Pagefind 构建
    8. sitemap/noindex/canonical 校验
    9. 死链校验
    10. 构建体积、文件数、最大单文件检查
    11. AI 内容质量检查
    12. Playwright iframe 抽检
    13. preview 部署
    14. 手动批准后 production 部署

    请输出完整方案,包含:

    1. 需求复述和剩余问题
    2. 架构图
    3. 技术选型对比和结论
    4. 项目目录结构
    5. package.json
    6. astro.config.mjs
    7. Wrangler 当前推荐配置
    8. Content Collections schema
    9. wrapper 导入脚本
    10. genre 生成与分类映射
    11. iframe 解析与安全渲染
    12. 首页、游戏页、分类页、搜索页、文章页实现
    13. remark-directive 插件和游戏卡片挂载
    14. Gemini Batch 脚本、Prompt、审核与重试
    15. SEO、sitemap、robots、JSON-LD
    16. 用户协议和隐私政策页面
    17. _headers、_redirects
    18. GitHub Actions workflow
    19. Cloudflare DNS/部署步骤
    20. 构建优化和性能预算
    21. 移动端基础适配
    22. Playwright 验收清单
    23. 分阶段上线到 2,268 款的计划
    24. 风险清单和缓解措施
    25. 所有需要创建的文件及作用
    26. 最终验收标准