美观、现代化的 OsynicOsuapi 演示网站, 基于Leptos框架开发

中文版本 | English Version

LeptosOsuapiPlayground 是一个基于 Rust Leptos 框架开发的现代化 Web 应用，它展示了 OsynicOsuapi 库的功能和用法。通过 WebAssembly (WASM) 技术，OsynicOsuapi 能够直接在浏览器中与 osu! API 进行交互，无需后端服务器处理请求。

很显然，由于CORS的问题，不代理直接在浏览器中使用V1的API会遇到跨域问题（毕竟WASM部分是浏览器前端发的请求嘛），所以用Deno来搭建了一个中转服务器osynic-cors.deno.dev，配合WASM客户端的proxy_url来实现代理请求；

目前网站通过Deno部署在osynic-osuapi.deno.dev，支持中日韩德法俄英等多种语言；

这个项目不仅是 OsynicOsuapi 库的一个实际应用示例，也是学习 Rust、Leptos 和 WASM 技术的绝佳资源。

• 🚀 高性能：基于 Rust 构建，提供卓越的性能和内存安全性
• 🛡️ 类型安全：利用 Rust 的强类型系统，在编译时捕获错误
• 🌐 WASM 兼容：直接在浏览器中运行，无需后端服务
• 📊 完整 API 支持：支持 osu! API v1 和 v2 的大多数端点
• 📱 响应式设计：适配各种屏幕尺寸的美观界面
• ⚡ 实时演示：提供实时 API 请求和响应展示

访问 https://osynic-osuapi.deno.dev 立即体验 LeptosOsuapiPlayground。

您需要自己的 osu! API 密钥才能使用演示功能。如果没有，可以在 osu! 个人设置页 的"旧版本API"部分申请一个。

# 克隆仓库
git clone https://github.com/Islatri/leptos_osuapi_playground.git
cd leptos_osuapi_playground

# 安装依赖（需要 Rust 和 Cargo）
cargo install trunk
rustup target add wasm32-unknown-unknown

# 启动开发服务器
trunk serve

然后在浏览器中访问 http://localhost:1420 即可。

leptos_osuapi_playground/
├── src/                    # 源代码目录
│   ├── components/         # UI 组件
│   ├── layouts/            # 布局组件
│   ├── stores/             # 状态管理
│   ├── i18n.rs             # 国际化文件
│   ├── main.rs             # 应用入口
│   ├── index.css           # 全局样式
│   └── app.rs              # 主应用组件
├── public/                 # 静态资源
├── locales/                # 翻译文件 (.ftl)
├── tailwind.config.js      # Tailwind CSS 配置
├── Cargo.toml              # 项目配置
├── Trunk.toml              # Trunk 配置
├── index.html              # HTML 入口
└── README.md               # 项目说明

LeptosOsuapiPlayground 提供了两种主要的 API 查询功能：

输入谱面集 ID，获取该谱面集的详细信息，包括：

• 标题和艺术家
• 难度名称和星级
• BPM 等技术信息

输入用户名或用户 ID，获取该用户的详细信息，包括：

• 用户名和用户 ID
• 国家和排名
• PP 值和准确度
• 游戏次数等统计数据

• Rust 工具链 (1.85+)
• trunk (用于打包 WASM 应用)
• wasm32-unknown-unknown 目标

rustup default stable
rustup target add wasm32-unknown-unknown
cargo install trunk

trunk serve --open

trunk build --release

• 🦀 Rust - 系统编程语言
• 🔄 Leptos - Rust 前端框架
• ⚡ WebAssembly (WASM) - 浏览器中运行的二进制格式
• 🎮 OsynicOsuapi - Rust osu! API 客户端
• 🌐 LeptosFluent - 国际化框架

我们欢迎各种形式的贡献！请按照以下步骤参与：

1. Fork 本仓库
2. 创建您的特性分支 (git checkout -b feature/amazing-feature)
3. 提交您的更改 (git commit -m 'Add some amazing feature')
4. 推送到分支 (git push origin feature/amazing-feature)
5. 开启一个 Pull Request

本项目采用 MIT 许可证 - 详情请参阅 LICENSE 文件

• osu! 提供精彩的游戏和 API
• Rust 和 Leptos 社区的持续支持
• 所有为项目做出贡献的开发者

LeptosOsuapiPlayground 是非官方项目，与 osu! 官方无关。本项目仅用于学习和展示目的。