本项目纯AI生成，没有一行代码是手写的。

本人是傻福，不懂任何技术~

---

项目简介

一个输入数字就能生成 MIDI 音乐的网页工具。无需安装任何音乐软件，在浏览器中填写音符数据，点击按钮即可下载 .mid 文件。

技术栈

层	技术
前端	Vite + Vue 3（Composition API）
后端	Python FastAPI + mido
MIDI 生成	mido 库

项目结构

midiTest/
├── .gitignore
├── readme.md
├── interact.md                    # 输入格式说明
├── backend/
│   ├── main.py                    # FastAPI 入口，端口 8000
│   ├── midi_generator.py          # MIDI 生成核心逻辑
│   └── requirements.txt
└── frontend/
    ├── index.html
    ├── package.json
    ├── vite.config.js             # 含 /api 代理配置
    └── src/
        ├── main.js
        ├── style.css
        ├── App.vue                # 主应用
        ├── components/
        │   ├── ExamplePanel.vue   # 右侧案例面板
        │   └── FileUpload.vue     # CSV/JSON 文件上传
        ├── composables/
        │   └── useMidiNotes.js    # 音符状态管理 + 文本解析
        └── presets/
            └── index.js           # 6 个预设模板

快速开始

1. 安装依赖

# 后端
cd backend
pip install -r requirements.txt

# 前端
cd frontend
npm install

2. 启动服务

# 终端 1：启动后端
cd backend
python -m uvicorn main:app --port 8000

# 终端 2：启动前端
cd frontend
npm run dev

3. 打开浏览器

访问 http://localhost:5173

数据流

用户输入文本（textarea）
    → useMidiNotes 解析为音符数组
    → App.vue 组装 JSON
    → POST /api/generate-midi
    → midi_generator.py 生成 MIDI 字节
    → 浏览器下载 .mid 文件

API 接口

POST /api/generate-midi

生成 MIDI 文件并返回二进制数据。

请求体：

{
  "bpm": 120,
  "notes": [
    { "pitch": 60, "duration": 1.0, "velocity": 100 },
    { "pitch": 62, "duration": 0.5, "velocity": 80 }
  ]
}

字段	类型	范围	说明
bpm	int	20-300	速度（拍/分钟）
notes[].pitch	int	0-127	音高，60 = 中央 C
notes[].duration	float	0.1-64	持续时间（拍）
notes[].velocity	int	1-127	力度（响度）

响应： audio/midi 二进制数据，自动触发浏览器下载。

GET /api/health

健康检查，返回 {"status": "ok"}。

预设模板

模板	说明
C大调音阶	上行 C-D-E-F-G-A-B-C
小星星	经典儿歌旋律
欢乐颂	贝多芬第九交响曲主题
琶音练习	C大调三和弦琶音上行
简单低音线	四拍循环低音进行
音效测试	不同力度对比测试