海外在线游戏站goyahaha.com产品系统

我要开发同款
翻书的熊猫2026年09月09日
6阅读

技术信息

语言技术
HTML5CSSJavaScriptReactGo
系统类型
Web
行业分类
游戏

作品详情

行业场景

1. H5 小游戏平台赛道。 CrazyGames、Poki 类型的网页游戏平台是休闲游戏出海的主流赛道:无需下载、点开即玩,靠广告与分成变现,获客成本低。GoYahaha 定位"精品收录"——只上架认真筛选、值得反复体验的 H5 游戏,以策划精选而非数量堆砌做差异化,是中小团队进入 H5 发行领域的典型场景。

2. 全球化多语言运营。 平台按 locale 输出中/英等多语言站点(URL 级路由 + 语言切换器),同一套游戏目录服务不同市场,符合休闲游戏"一个目录、全球分发"的运营模式。

3. 游戏资产云分发。 游戏封面、截图、H5 游戏静态包走独立 CDN 子域(games-cdn.goyahaha.com),与站点本体分离,是游戏平台"站轻游重"的经典架构场景。

4. 高频发版的内容运营。 游戏上架/下架与代码部署完全解耦:运营发新游戏不需要重新部署 Worker,支撑"每周上新"的平台运营节奏。

功能介绍

1. 平台首页(全屏章节式)
- 品牌 Hero + 搜索 + 语言切换:slogan"现在,玩点开心的",无需下载选一个就开玩
- 游戏墙:瀑布式街机板布局,游戏封面、分类角标、分类色块卡与标签快捷卡(水果/物理/合成/解压…)混排
- 01/NEW 最新上架、02/PLAY 大家正在玩、03/MOODS 按心情选分类(休闲/益智/动作/模拟经营/冒险/策略/街机/体育 8 大分类)、ABOUT 平台介绍
- "随机玩一个"入口:一键随机跳转游戏

2. 游戏详情页(固定三屏)
- 第一屏:16:9 游戏播放器 + 周边游戏格;播放器上以浮层保留点赞、不喜欢、收藏操作
- 第二屏:游戏信息、玩法说明("怎么玩"分步指引)、"接着玩"同类推荐
- 第三屏:平台介绍与游戏原则(精品收录/即点即玩/多端友好)

3. 即点即玩播放器
- 点击封面即进入游戏,H5 游戏在站内播放器中运行,支持全屏、静音
- 无需账号即可游玩,收藏/点赞/最近游玩本地留存


4. 分类与发现
- 8 大分类页 + 标签页(冲刺/高分/合成/水果/物理/侦探…),街机板布局统一呈现
- 最新上架 / 热门游戏 / 最近游玩独立列表页
- 站内搜索(快捷键 `/` 唤起)

项目实现

我负责全站UI、前端、服务端项目
1. 单 Worker 一体化架构(OpenNext for Cloudflare)
通过 `@opennextjs/cloudflare` 把 Next.js 页面、静态资源和 Route Handlers(含 `/api/v1`)部署为一个 Cloudflare Worker,前端与 API 同源,不需要单独的 API 子域与 CORS。数据面:

2. 发布与部署解耦

代码/迁移/Worker 配置变更才部署 Worker;新增、修改、下架游戏只发布新的不可变 catalog release,全部投影上传完成后原子更新 `current.json` 指针——不需要 Deploy Hook,也不需要重建 Worker,实现"上架游戏秒级生效、发布出错秒级回滚"。

3. 响应式全屏章节模型
- 手机横屏/竖屏统一"一次滑动切换一整屏"章节模型,菜单点击、URL Hash 与手势滚动由 `FullpageDiscovery` 统一对齐
- 手机横屏隐藏常驻搜索栏与底部导航,改用 2×2 Logo 功能格唤起搜索/菜单浮层,浮层不卸载正运行的游戏
- 游戏格布局由 `ResponsiveArcadeBoard` + `planArcadeLayout` 统一计算:首页、分类页、详情页共享相同单元尺寸、间距与响应式密度规则,保证视觉一致性

示例图片

声明:本文仅代表作者观点,不代表本站立场。如果侵犯到您的合法权益,请联系我们删除侵权资源!如果遇到资源链接失效,请您通过评论或工单的方式通知管理员。未经允许,不得转载,本站所有资源文章禁止商业使用运营!
下载安装【程序员客栈】APP
实时对接需求、及时收发消息、丰富的开放项目需求、随时随地查看项目状态

评论