├── README.md ├── functions └── api │ └── tts.js └── index.html /README.md: -------------------------------------------------------------------------------- 1 | # TTS Web Interface 2 | 3 | 这个项目是一个简单的文本转语音（TTS）Web界面，使用Cloudflare Pages和Functions来部署。它允许用户输入文本，选择语音模型和声音，然后生成相应的音频文件。 4 | 5 | ## 功能 6 | 7 | - 支持多种中文语音模型 8 | - 简洁的用户界面 9 | - 实时音频预览 10 | - 使用Cloudflare Pages进行静态文件托管 11 | - 使用Cloudflare Functions进行安全的API调用 12 | 13 | ## 部署指南 14 | 15 | 按照以下步骤在Cloudflare上部署这个项目： 16 | 17 | 1. **准备工作** 18 | - 注册一个[Cloudflare账户](https://dash.cloudflare.com/sign-up) 19 | - 确保您有一个GitHub账户 20 | 21 | 2. **设置仓库** 22 | - Fork这个仓库到您的GitHub账户 23 | - 克隆您fork的仓库到本地机器 24 | 25 | 3. **配置项目文件** 26 | - 确保您的项目结构如下： 27 | ``` 28 | your-project/ 29 | ├── functions/ 30 | │ └── api/ 31 | │ └── tts.js 32 | ├── index.html 33 | └── README.md 34 | ``` 35 | - 如果需要，根据您的TTS API供应商调整`functions/api/tts.js`中的API端点 36 | 37 | 4. **部署到Cloudflare Pages** 38 | - 登录到您的[Cloudflare dashboard](https://dash.cloudflare.com/) 39 | - 导航到"Pages"部分 40 | - 点击"Create a project"按钮 41 | - 选择"Connect to Git" 42 | - 选择您包含项目文件的GitHub仓库 43 | - 在构建设置中： 44 | - 构建命令：留空 45 | - 构建输出目录：`/` 46 | - 点击"Save and Deploy" 47 | 48 | 5. **配置环境变量** 49 | - 在您的Pages项目中，转到"Settings" > "Environment variables" 50 | - 添加一个名为`TTS_API_KEY`的变量，并设置您的TTS API密钥作为其值 51 | - 保存更改 52 | 53 | 6. **启用Functions** 54 | - 在您的Pages项目中，转到"Settings" > "Functions" 55 | - 确保"Functions"已启用 56 | 57 | 7. **重新部署** 58 | - 转到"Deployments"标签 59 | - 点击"Retry deployment"以应用新的配置 60 | 61 | 8. **访问您的网站** 62 | - 部署完成后，Cloudflare会提供一个URL（通常是`https://your-project-name.pages.dev`） 63 | - 访问这个URL来使用您的TTS Web界面 64 | 65 | ## 使用说明 66 | 67 | 1. 在浏览器中打开您的TTS Web界面URL 68 | 2. 在"Model"字段中输入TTS模型（默认为"tts-az-1"） 69 | 3. 从下拉菜单中选择所需的语音 70 | 4. 在文本区域输入您想要转换为语音的文字 71 | 5. 点击"Generate Audio"按钮 72 | 6. 等待音频生成完成，然后使用内置播放器收听结果 73 | 74 | ## 注意事项 75 | 76 | - 确保您的TTS API密钥保密且安全 77 | - 定期检查并更新您的依赖项 78 | - 遵守您使用的TTS API服务的使用条款和限制 79 | 80 | ## 贡献 81 | 82 | 欢迎提交问题和拉取请求来改进这个项目！ 83 | -------------------------------------------------------------------------------- /functions/api/tts.js: -------------------------------------------------------------------------------- 1 | export async function onRequestPost(context) { 2 | const { request, env } = context; 3 | const { model, voice, input } = await request.json(); 4 | 5 | const ttsResponse = await fetch('https://burn.hair/v1/audio/speech', { 6 | method: 'POST', 7 | headers: { 8 | 'Authorization': `Bearer ${env.TTS_API_KEY}`, 9 | 'Content-Type': 'application/json' 10 | }, 11 | body: JSON.stringify({ model, voice, input }) 12 | }); 13 | 14 | if (!ttsResponse.ok) { 15 | return new Response('Error calling TTS API', { status: ttsResponse.status }); 16 | } 17 | 18 | const audioBuffer = await ttsResponse.arrayBuffer(); 19 | return new Response(audioBuffer, { 20 | headers: { 21 | 'Content-Type': 'audio/mpeg' 22 | } 23 | }); 24 | } 25 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | TTS Web Interface 7 | 49 | 50 | 51 |

TTS Web Interface

52 |
53 | 54 | 55 | 56 | 57 | 86 | 87 | 88 | 89 | 90 | 91 |
92 | 93 |
94 |
0%
95 |
96 | 97 | 103 | 104 | 147 | 148 | 149 | --------------------------------------------------------------------------------