[Based Dino] 复刻 Chrome 小恐龙,并给它加上排行榜、回放和服务端校验

5 月 7 日
 lvhuiyang

Vibe Coding 了一个小玩具:Based Dino 。

这是一个用 TypeScript 复刻的 Chrome 离线小恐龙游戏,尽量保持原版 chrome://dino 的玩法和手感:空格起跳、下键下蹲、撞到障碍物后 Game Over 。

不过这次不只是复刻玩法,还顺手加了几个原版没有的能力:

  1. 排行榜:每局结束后可以提交分数,并在页面里查看当前排名。
  2. Replay:点击 Replay 可以重放上一局,重新看到自己刚才是怎么跳、怎么躲、怎么撞上的。
  3. 服务端校验:排行榜不是简单相信前端上报的分数,而是会在服务端重新跑一遍模拟。

这里最有意思的地方是防作弊。

如果排行榜只接收一个 score,前端随便改请求就能刷榜。所以我让前端在 Game Over 后提交的不只是分数,还包括这一局的随机种子、输入轨迹、结束帧数和配置哈希。Cloudflare Workers 收到后,会用同一套模拟逻辑 replay 一遍:只有服务端算出来的分数、帧数和客户端上报结果一致,才会写入排行榜。

而 Replay 功能也是从这套机制里自然长出来的:既然已经记录了随机种子和输入轨迹,那就可以用同样的 seed 重建同一局游戏,再按原来的帧序列把操作重放出来。

当前部署在 Cloudflare Pages & Workers 上,排行榜数据存在 Cloudflare D1 里。

体验链接

https://based-dino.lvhuiyang.cn

后续

后面想继续把它往链上玩一下。项目叫 Based Dino ,也是因为我打算把排行榜这类需要公开记录的数据迁到 Base 链上; Cloudflare Workers 只负责校验,最终结果由链上来保存。

等完成后续这部分逻辑后考虑进行开源。

欢迎来试试,也欢迎挑战一下排行榜并给出意见/建议。

1196 次点击
所在节点    分享创造
0 条回复

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://v2ex.ih06.com/t/1210728

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX