首页 › games › 《Kaetram》捡了个Demo,养成网页MMO

仓库档案

这游戏是什么

一句话:打开浏览器,操纵一个像素小人在一张大地图上打怪、捡装备、做任务、摆摊交易、加公会下副本,服务器里还有一堆真人和你擦肩而过——一个“迷你版魔兽世界”,但不用下载 80G 客户端,网页里点开就玩。

它的出身比游戏本体还精彩,值得单独讲一遍:

2012 年,Mozilla 为了向全世界展示 WebSocket 技术——那时候前端圈刚知道“原来浏览器能和服务器保持长连接”——委托法国的小工作室 Little Workshop 做了一个技术演示:一个横版像素小人,从出生点一路砍怪走到终点,路上能碰到其他在线玩家的名字。这就是 BrowserQuest。当年它一发出来就在开发者圈里刷屏,无数人第一次亲眼见到“网页里也能跑多人游戏”。

但 Demo 就是 Demo:地图小、玩法薄、没有存档没有成长,技术秀完了就束之高阁,Mozilla 的原仓库后来也早已停止维护。故事到这里本该结束——直到社区里有人把这份代码捡了起来。这个人没有把它当文物供着,而是当成地基:重写、扩建、一层层往上加盖。地图扩大、加了物品和背包、加了任务和怪物 AI、加了交易和公会、加了 PVP,硬是把一个“能跑的 Demo”养成了“能玩的 MMO”。

这就是 Kaetram。它对个人开发者最大的示范意义不在代码量,而在姿态:你不需要从零造一个世界,你可以捡一个被大公司扔掉的世界,慢慢养大。

玩家核心循环长这样:

flowchart TD
    A["上线:领出你的小人"] --> B["打怪 / 做任务"]
    B --> C["掉装备 + 涨经验"]
    C --> D["升级换装:两根进度条都在动"]
    D --> E["挑战更难的怪、副本、其他玩家"]
    E --> F["打不过?回城补药换策略"]
    F --> B
    D --> G["加公会 / 摆摊交易"]
    G --> H["下线:服务器里有人明天还等你"]
    H --> A

注意这个循环里最外面那一圈:从 H 绕回 A 的不是系统,是别的人。这是它和之前写过的所有单机仓库最本质的区别。

为什么上头

前几期我们拆过不少上头机制:《A Dark Room》和《Evolve》靠的是单机放置的进度感,《2048》靠即时反馈,《Pixel Dungeon》靠随机性。MMO 是这些东西的乘法,而不是加法。逐条拆:

一、双进度条引擎。 等级和装备是两套独立又在咬合的进度系统。等级给你“我变强了”的体感,装备给你“我变好看且更强了”的双重刺激。单机游戏一根进度条就够上头,MMO 给你两根,还互相拖动——升级解锁能穿的装备,好装备又把刷怪效率翻倍,刷得越快等级涨得越快。这个正反馈齿轮一旦转起来,人是很难主动下车的。

二、掉落就是老虎机。 怪物死掉、地上爆出一道光、走过去捡起来——这一套动作是标准的间歇性随机奖励。你不知道下一只怪掉什么,所以“再刷一只”永远有理由。Kaetram 保留并扩展了这套东西:稀有装备、材料、任务道具,每一个都是拉杆的手感。

三、“服务器里有人”是所有钩子里最狠的一个。 这是单机游戏花钱都买不来的东西。你站在出生点,旁边一个小人跑过去,穿了一身你没见过的装备——就这一个瞬间,三件事同时发生:攀比心被点燃(他哪搞的?)、信息差出现(有我不知道的玩法?)、社交契约成立(这个世界是活的,我下线它会继续转)。心理学上这叫社会证明,翻译成人话就是:别人都在玩,我凭什么走。

四、角色即存档,离开即亏损。 单机游戏删档你心疼的是进度,MMO 删掉的是你的脸面资产——等级、时装、公会职位、朋友们记得你的 ID。沉没成本在单机里是数值,在 MMO 里是身份。这就是为什么 MMO 玩家的生命周期价值远超单机。

五、目标永远在后头。 单机通关就卸载,MMO 永远不让你“打完”:满级之后有毕业装,毕业装之后有 PVP 排名,排名之后有公会战。设计者甚至不需要做新内容,“别人比你强”这个事实本身就是无尽的内容生成器。

把这五条抄回你自己的小游戏:哪怕只做一个“世界频道 + 可见的其他玩家 + 一套时装系统”,上头系数都会完全不一样。

技术拆解

技术栈:全仓 TypeScript,服务端跑 Node.js,客户端跑浏览器,前后端同一种语言——这是个人开发者能维护一个 MMO 的前提。试想如果服务端 Java、客户端 C++、地图工具另一个格式,一个人早就被工具链拖死了。

架构上几个值得扒的点:

一、实体同步骨架。 MMO 最核心的技术问题就一个:N 个玩家 + M 只怪,每个人的屏幕上都要实时画出一小块世界的当前状态。BrowserQuest 时代留下的 WebSocket 推送 + 实体状态机的底子,Kaetram 在上面继续翻修。对想学“多人游戏最小骨架”的人来说,这份代码比任何教程都直观——一个连接管理器、一个实体列表、一个消息分发循环,MMO 的底牌就这么三张。

二、A* 寻路。 BrowserQuest 的遗产之一,网格地图上的自动寻路,怪物追踪和玩家点击移动都靠它。这个模块几乎可以原样抄进任何 2D 格子游戏。

三、Tiled 地图管线。 这是整个仓库里最值钱的可复用资产。地图用业界标准的 Tiled 编辑器画,导出后由游戏加载成可碰撞、可刷怪、可放传送点的世界。个人开发者自己写地图编辑器是自杀行为,接 Tiled 是标准答案。你就算完全不做 MMO,做任何 2D 关卡游戏都该抄这套管线。

四、数据结构即玩法。 物品表、装备槽、背包格子、任务状态机——这套数据结构定义清楚了,游戏内容就是往表里加行。这也是为什么它作为“引擎”的扩展性很好:加一只新怪或一把新剑,改的是数据不是逻辑。

可以直接搬走的组件清单:WebSocket 同步骨架、A* 寻路、Tiled 加载管线、背包/装备数据结构、实体状态机。前两条加起来可能不到两千行,够你支撑起一个多人小游戏。

变现观察

先说仓库本身:据仓库页面,Kaetram 是纯开源社区项目,没有付费墙、没有内购商店的痕迹,作者赚的主要是影响力和社区。这个仓库的价值对你是教材和地基,不是直接的收入模板。

但“网页 MMO”这个品类本身,变现史灿烂得很,几个真实跑通的案例:

对应到 Kaetram 这类开源底座,个人可操作的路径按门槛排序:

  1. 网页广告:改造后挂广告位,适合挂机向、休闲向的换皮版本,门槛最低;
  2. 赛季门票 / 会员服:私服运营,免费玩基础内容,会员解锁加速、专属地图,RuneScape 模式的微缩版;
  3. 外观内购:时装、坐骑、称号——MMO 变现的黄金三角,不影响平衡,付费意愿最强;
  4. 卖铲子:把“一键部署自己的 MMO 服务器”做成 Docker 方案卖给想开服的社群、游戏公司面试题作者、独立游戏工作室,这是开源仓库独有的变现位。

再啰嗦一次:动任何一条之前,先确认 LICENSE 允许商用,以及素材版权归属。

给我的灵感

点子一:砍成单人版,两周上 itch.io。 把 Kaetram 里的多人模块整个拆掉,只留:一张 Tiled 地图 + 五种怪 + 掉落 + 背包 + 本地存档。这就是一个完整的网页 ARPG,做“减法”比做加法快得多——代码全是现成的,你只负责删。MVP 工作量 1~2 周,发 itch.io 收打赏,或者挂 Newgrounds/CrazyGames 吃广告分成。它给你的真实价值是:用最短时间亲手跑通“浏览器 ARPG”的全链路。

点子二:换皮修仙挂机 MMO。 核心循环一字不改——打怪、掉宝、换装、双进度条——题材换成中文用户最吃的修仙:炼气、筑基、金丹,装备换成法宝,公会换成宗门。加一个放置钩子(离线也有挂机收益),主战场放小程序和 H5,变现走激励视频广告 + 时装内购。这条路的竞品全是付费页游团队,但他们对“开源底座 + 极致轻量”毫无兴趣,个人开发者的成本优势在这里是碾压级的。工作量:内容换皮 2~4 周,广告接入再加一周。

点子三:不卖游戏,卖开服。 把 Kaetram 部署做成“周末限时服”——周五开服、周日关服,赛季制,全世界玩家同一批进、同一批结算排行榜。稀缺感直接拉爆留存(错过这批就要等下个周末),收费点:门票几块钱、赞助商冠名、或者干脆免费引流到你的下一个游戏。技术上就是 Docker + 一份部署文档的事,工作重心全在运营。这条路最适合已经有个小游戏、想学“如何让用户回头”的开发者——限时服是全网最便宜的留存实验。

上手

最后一句话总结:这个仓库教你的不是“怎么写一个 MMO”——是大公司扔掉的东西,个人开发者捡起来照样能养活。BrowserQuest 在 2012 年证明了网页里能跑多人游戏,Kaetram 在十几年后证明了一个人能把它养成世界。你缺的从来不是地基,是动第一铲子的那个下午。

[!tip] 51学通信知识星球 星主:爱卫生(微信:gprshome201101)——公众号「51学通信」创办者,19 年通信行业运维与讲师经验,著有《GPRS网络信令实例详解》《EPC原理与实践》《5G核心网原理与实践》三本纸质书(各大电商平台有售)。 星球定位:深耕 5G 核心网、IMS、NFV/AI、云原生等 ICT 领域,主打运维岗位与信令分析。 当前规模:5200 篇主题 / 990 个回答,198 元/年。 加入福利:加入星球后请加爱卫生微信,拉您进知识星球年度陪伴与答疑群——不限量回复您的各种问题,另有群内分享。 AI 加持:51学通信知识星球已作为 skill 接入 WorkBuddy,使用 deepseek-4-flash 在海量星球帖子中精准找贴、找视频、找 FAQ 和案例,做总结、找文档和 PPT 等场景全覆盖。

51学通信知识星球海报-扫码加入