项目

Petbook

用一个链接分享 CS2 宠物的相册,线上地址 petbook.win。

TypeScriptCloudflare WorkersR2D1Steam OpenIDPlaywright
Petbook viewer showing a CS2 HatchBookPetbook viewer showing a CS2 HatchBook

问题

CS2 把宠物相册以二进制格式存在玩家自己的硬盘上,没有任何分享方式。

我做了什么

逆向了相册文件(一个 Snappy 压缩块里的 JPEG 页面,加上含宠物名和孵化时间的 protobuf),移植了游戏的 Panorama 页面逻辑让浏览器渲染出一模一样的页面,再加上仅作者可用的编辑器,把位置信息按游戏自己的文件名标签写回去。

架构

  • Cloudflare Worker (TypeScript) — upload, viewer, owner API; no server to run
  • R2 for photos and uploads, D1 (SQLite) for accounts, pages, templates and traffic counters
  • Browser-side parsing of the cloud book file and pet.bin; only pages and the pet name are sent
  • Steam OpenID sign-in with a signed cookie; strict CSP on profile pages; per-IP rate limits
  • Personal pages with templates, music, effects and per-part analytics; site-wide analytics for the owner only

技术亮点

  • The 3D page turn, chapter bar, slot rules and photo crops match the game; text variants are chosen the same way the game does.
  • Drag-and-drop editor: Library panel, slot rules, zoom and pan sliders, layout strips; edits save in the game's file-name tag format.
  • Visitors are counted with a daily keyed hash; no IP address is stored. Bots and link-preview robots are ignored.

成效

  • Anyone can share a book with a link; the pages render the same on a phone.
  • Runs on the free tiers of Workers, R2 and D1.