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

Vibe Coding 了一个小玩具:Based Dino 。 这是一个用 TypeScript 复刻的 Chrome 离线小恐龙游戏,尽量保持原版 chrome://dino 的玩法和手感:空格起跳、下键下蹲、撞到障碍物后 Game Over 。 不过这次不只是复刻玩法,还顺手加了几个原版没有的能...
[分享创造] [Based Dino] 复刻 Chrome 小恐龙,并给它加上排行榜、回放和服务端校验
[分享创造] [Based Dino] 复刻 Chrome 小恐龙,并给它加上排行榜、回放和服务端校验

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

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

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

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

demo

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

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

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

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

体验链接

https://based-dino.lvhuiyang.cn

后续

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

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

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

来源: v2ex查看原文