企业官网建设流程全解析

webosu实时比分API开发指南：用Node.js实现排行榜服务

【免费下载链接】webosu➤⓵ web rhythm game (unofficial osu!) http://osugame.online/项目地址: https://gitcode.com/gh_mirrors/we/webosu

想为网页版节奏游戏 webosu 搭建一套自己的实时比分系统？本文是一份完整的webosu实时比分API开发指南，带你从零用Node.js实现一个排行榜服务。webosu 是一个开源的非官方 osu! 网页版实现，游戏结束后会把成绩上报到服务器，而官网正是用 Node.js 写了一个轻量 API（源码见 api.js）来接收成绩并向外提供实时数据。无论你是想搭个人服务器、学习前后端联动，还是做玩家排行榜，读完这篇指南都能直接动手。

先搞懂：webosu 实时比分系统是怎么工作的

webosu 的实时比分系统只有三个角色，理解它们你的 API 就成功了一半：

1. 游戏前端：对局结束后，浏览器把成绩打包成 URL 参数，用 GET 请求发给服务器；
2. 成绩接收端（POST 服务）：Node.js 服务器在 3000 端口接收成绩，暂存在内存数组中；
3. 数据查询端（GET 服务）：主页每 5 秒向 3001 端口请求一次 JSON，把最新成绩渲染到页面上。

前端上报成绩的代码在 scripts/overlay/score.js 的uploadScore函数里，一次上报包含 10 个字段：谱面 ID（sid）、难度 ID（bid）、标题、版本、Mods、评级（grade）、分数、连击数（combo）、准确率（acc）和时间戳。这就是你设计数据库表时最直接的参考。

最简实现：解析官方 api.js 源码

官方 api.js 只有 49 行，却完成了整套实时比分服务，非常适合入门。核心思路就两件事：

第一，接收成绩。服务器监听 3000 端口，把查询参数原样压进数组，数组超过 16 条就丢弃最旧的。为了隐私，它还会把玩家 IP 做脱敏处理（前两位替换成**）。

第二，提供数据。服务器监听 3001 端口，直接返回内存数组的 JSON，并带上Access-Control-Allow-Origin: *允许跨域访问，这样前端在任何域名下都能读取。

启动方式官方也写得很清楚，在 README 的 Hosting 一节：先让 web 服务器根目录指向index.html所在目录，把前端 send/fetch 请求重定向到本地 3000/3001 端口，然后后台运行：

nohup node api.js &

最快搭建方法：三步跑通 Node.js 排行榜服务

如果你只是想快速体验，跟着这三步走即可：

第一步，获取项目源码（仓库地址https://gitcode.com/gh_mirrors/we/webosu），确认api.js与index.html在同一目录。

第二步，修改前端接口地址。把 index.html 和 scripts/overlay/score.js 中的http://api.osugame.online/换成你自己的域名或 IP。

第三步，启动服务并验证。运行node api.js后，用浏览器打开http://localhost:3001应看到[]；再模拟一次上报，访问http://localhost:3000/?title=test&score=100，刷新 3001 端口就能看到成绩入库了。

进阶玩法：把内存数组升级为持久化排行榜服务

官方版把成绩存在内存里，服务器重启数据就丢了。要做一个真正的排行榜服务，最省事的办法是引入 SQLite 持久化。改造思路如下：

• 用better-sqlite3建立scores表，字段对应上报的 10 个参数；
• POST 服务收到成绩后INSERT入库，而不是塞进数组；
• GET 服务改成SELECT ... ORDER BY score DESC LIMIT 50，返回真正的排行榜；
• 增加一个按谱面过滤的接口，比如?sid=123只看某张图的成绩，这就是最基础的"单图排行榜"。

再进一步，你还可以按grade统计评级分布、按mods区分休闲与硬核玩家、甚至引入用户系统，把官网 README 里"TODO"的 pp 与用户系统补上。

常见问题与避坑指南

为什么前端一直报 failed fetching activities？多半是接口地址没改干净，记得score.js和index.html两处都要替换。

跨域报错怎么办？GET 响应头必须包含Access-Control-Allow-Origin: *，官方源码里这行别删。

想保留官方"最近 16 条"的滚动效果？那是a.shift()在起作用，改成 SQL 后可用LIMIT 16配合时间倒序实现同样的效果。

生产环境部署建议用nohup或 pm2 守护进程，并考虑把接收端与查询端拆到不同进程，避免成绩写入高峰拖慢排行榜读取。

总结

webosu 的实时比分 API 设计堪称"小而美"的典范：一个文件、两个端口、十几行核心逻辑，就撑起了整站的实时排行榜。用 Node.js 实现排行榜服务并不难，照着官方 api.js 的思路，再从内存存储平滑升级到 SQLite 持久化，你就能拥有一个完全自主可控的 webosu 实时比分系统。快动手试试吧！

【免费下载链接】webosu➤⓵ web rhythm game (unofficial osu!) http://osugame.online/项目地址: https://gitcode.com/gh_mirrors/we/webosu