news 2026/10/27 1:50:03

如何用tts API打造AI配音应用:JavaScript与cURL调用实战

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
如何用tts API打造AI配音应用:JavaScript与cURL调用实战

【免费下载链接】tts

一个基于 Microsoft Edge TTS 的免费在线语音合成服务,支持 20+ 种中文声音,一键将文字转换为自然流畅的语音。

项目地址:https://gitcode.com/gh_mirrors/tts25/tts
点击查看免费下载

tts 是一个基于 Microsoft Edge TTS 的免费在线语音合成服务,支持 20+ 种中文声音,可一键将文字转换为自然流畅的语音。本文将带你用 JavaScript 和 cURL 调用 tts API,快速打造属于自己的 AI 配音应用——全程免费、无需注册、零配置。🎙️

📦 项目概览:tts 提供了什么

tts 部署在 Cloudflare Workers 上,同时提供网页界面和 RESTful API,兼容 OpenAI TTS 接口格式。它的核心能力包括:

  • 文字转语音(TTS):基于 Microsoft Edge TTS,提供 20+ 种中文音色
  • 语音转文字(STT):集成硅基流动 API,支持 9 种音频格式识别
  • 丰富参数:语速、音调、音量、语音风格均可调节
  • 完全免费:无注册门槛,无调用限制

项目的全部代码集中在 index.js 一个文件中,Cloudflare Workers 的部署配置见 wrangler.toml,完整的 API 文档参考 README.md。

两步部署,获得你自己的 API 地址

# 克隆项目 git clone https://gitcode.com/gh_mirrors/tts25/tts # 安装 Wrangler CLI 并启动本地开发 npm install -g wrangler wrangler dev

也可以使用wrangler.toml中的一键部署按钮直接发布到 Cloudflare Workers,部署完成后你会得到一个形如https://your-worker.workers.dev的域名,本文后续所有调用示例都基于这个地址。

🚀 最快上手:用 cURL 生成第一段语音

tts 的文字转语音接口是POST /v1/audio/speech,请求体为 JSON,响应直接返回 MP3 音频流(输出格式为audio-24khz-48kbitrate-mono-mp3)。只需一条 cURL 命令就能得到第一个语音文件:

curl -X POST "https://your-worker.workers.dev/v1/audio/speech" \ -H "Content-Type: application/json" \ -d '{ "input": "你好,欢迎使用 tts 语音合成服务", "voice": "zh-CN-XiaoxiaoNeural", "speed": 1.0, "pitch": "0", "style": "general" }' \ --output speech.mp3

执行完成后,本地就会生成speech.mp3,可以直接用播放器试听。🎧

💡 小贴士:--output参数让 cURL 把响应体直接保存为 MP3 文件。如果响应是 JSON 而不是音频,说明请求出错了,JSON 中的error.message会告诉你是哪里的问题。

💻 JavaScript 调用:浏览器与 Node.js 通用

前端页面调用 tts API 只需要几行fetch代码,响应以 Blob 形式接收:

const response = await fetch('https://your-worker.workers.dev/v1/audio/speech', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ input: "这段文字将在你的网页里被朗读出来", voice: "zh-CN-YunxiNeural", // 换个男声试试 speed: 1.2, // 语速加快 20% pitch: "+5", // 音调略微升高 style: "cheerful" // 愉快欢乐风格 }) }); const audioBlob = await response.blob(); const audioUrl = URL.createObjectURL(audioBlob); new Audio(audioUrl).play(); // 立即播放

同样的写法在 Node.js 中也能直接跑(Node 18+ 内置 fetch),拿到 Blob 后写入文件即可保存:

import { writeFileSync } from 'fs'; const response = await fetch('https://your-worker.workers.dev/v1/audio/speech', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ input: "批量生成旁白第一集", voice: "zh-CN-XiaoxuanNeural" }) }); writeFileSync('ep01.mp3', Buffer.from(await response.arrayBuffer())); console.log('生成成功:ep01.mp3');

⚙️ API 参数完整清单

这是打造配音应用时最常用的 6 个参数(完整定义见 index.js 中的路由处理逻辑):

参数类型默认值说明
inputstring-要转换的文本内容(必填)
voicestringzh-CN-XiaoxiaoNeural音色,20+ 种中文可选
speednumber1.0语速,范围 0.5 ~ 2.0
pitchstring"0"音调,-50 到 +50
stylestring"general"语音风格,见下表
volumestring"0"音量,-50 到 +50

推荐音色速查

女声(13 种):

  • zh-CN-XiaoxiaoNeural晓晓 · 温柔(默认,旁白首选)
  • zh-CN-XiaoyiNeural晓伊 · 甜美
  • zh-CN-XiaochenNeural晓辰 · 知性
  • zh-CN-XiaomengNeural晓梦 · 梦幻
  • zh-CN-XiaoqiuNeural晓秋 · 成熟
  • zh-CN-XiaoshuangNeural晓双 · 活泼
  • zh-CN-XiaoxuanNeural晓萱 · 清新
  • 另有晓涵、晓墨、晓睿、晓颜、晓悠、晓甄等音色

男声(8 种):

  • zh-CN-YunxiNeural云希 · 清朗
  • zh-CN-YunyangNeural云扬 · 阳光
  • zh-CN-YunfengNeural云枫 · 磁性
  • zh-CN-YunjianNeural云健 · 稳重
  • 另有云皓、云夏、云野、云泽等音色

11 种语音风格

style 值适用场景
general通用旁白(默认)
assistant智能助手、导航播报
chat对话机器人
customerservice客服话术
newscast新闻、资讯播报
affectionate亲子、情感内容
calm助眠、冥想音频
cheerful带货、短视频开场
gentle轻阅读、散文朗读
lyrical诗歌、歌词朗诵
serious正式场合、公告

🛠️ 实战:10 分钟搭一个 AI 配音小应用

下面是一个可直接保存为index.html在浏览器打开的极简配音应用:输入文本 → 选择音色风格 → 一键生成并播放。核心就是"表单 + fetch + Audio 播放"三件套:

<h1>AI 配音小应用</h1> <textarea id="text" rows="6" placeholder="输入要配音的文字…"></textarea> <select id="voice"> <option value="zh-CN-XiaoxiaoNeural">晓晓(温柔)</option> <option value="zh-CN-YunxiNeural">云希(清朗)</option> <option value="zh-CN-XiaoshuangNeural">晓双(活泼)</option> </select> <select id="style"> <option value="general">通用</option> <option value="newscast">新闻播报</option> <option value="cheerful">愉快欢乐</option> </select> <button onclick="generate()">🎬 生成语音</button> <audio id="player" controls></audio> <script> const BASE = 'https://your-worker.workers.dev/v1/audio/speech'; async function generate() { const res = await fetch(BASE, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ input: document.getElementById('text').value, voice: document.getElementById('voice').value, style: document.getElementById('style').value }) }); if (!res.ok) { const err = await res.json(); alert('生成失败:' + err.error.message); return; } document.getElementById('player').src = URL.createObjectURL(await res.blob()); document.getElementById('player').play(); } </script>

把BASE换成你自己的部署地址,就能得到一个可用的配音工具。想进一步扩展?批量循环调用接口可以为整本小说逐章配音,配合speed和pitch参数还能模拟不同角色的声线。

进阶:上传 txt 文件批量转语音

接口同时支持multipart/form-data方式直接上传 txt 文件(handleFileUpload 负责处理),限制为 500KB、10000 字符以内:

curl -X POST "https://your-worker.workers.dev/v1/audio/speech" \ -F "file=@chapter1.txt" \ -F "voice=zh-CN-XiaoxuanNeural" \ -F "style=newscast" \ --output chapter1.mp3

长文本无需担心,服务端内置了智能分块与批量合成逻辑(optimizedTextSplit),会自动把超长文本切成小段依次合成再拼接。

🧯 错误处理与常见问题

tts 的错误响应采用统一 JSON 结构,error.message是人类可读的原因,error.code便于程序判断:

{ "error": { "message": "音频文件大小不能超过10MB", "type": "invalid_request_error", "code": "file_too_large" } }

常见问题排查:

现象原因与解决
返回edge_tts_error(500)文本含特殊字符或上游服务波动,可先重试;文本超长时先分片
返回invalid_file_type(400)上传的不是 txt / 支持的音频格式,请检查文件扩展名
浏览器跨域报错接口已内置完整 CORS 头(handleOptions),确认 URL 域名写对即可
音频"变加速音"pitch传成了语速值;音调范围是 -50 ~ +50,语速speed才是 0.5 ~ 2.0

📌 写在最后

tts 把 Edge TTS 的强大能力封装成了 3 个字段就能调用的免费 API:一个POST请求、一段 JSON、返回一个 MP3——这就是打造 AI 配音应用的全部门槛。🚀

核心要点回顾:

  1. 部署项目,拿到自己的 API 地址(参考 wrangler.toml)
  2. POST /v1/audio/speech+ JSON 参数,用 cURL 或 fetch 皆可
  3. 用voice+style组合出最适合场景的声音
  4. 响应非 JSON 时就是 MP3,直接保存或播放

完整参数表和音色列表见 README.md,接口实现细节都在 index.js 中,欢迎动手改造出你专属的配音应用!

【免费下载链接】tts

一个基于 Microsoft Edge TTS 的免费在线语音合成服务,支持 20+ 种中文声音,一键将文字转换为自然流畅的语音。

项目地址:https://gitcode.com/gh_mirrors/tts25/tts
点击查看免费下载
上一篇:官方演示 vs 社区复刻:同一个 VoiceBox,谁更值得装进项目
下一篇:CMake MacroAddFileDependencies 模块深度解析:源码文件级依赖管理与 OBJECT_DEPENDS 迁移实践

创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/10/27 1:49:50

UE5魂系游戏开发教程02

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

作者头像 李华
网站建设 2026/10/27 1:49:02

阿里二面:外部接口大量超时把系统拖垮引发雪崩,如何解决?熔断、限流、降级、隔离原理与实战详解

一、面试现场&#xff1a;一道看起来简单&#xff0c;实则暗藏杀机的问题阿里二面通常不会只问八股文&#xff0c;面试官更喜欢从一个真实事故切入&#xff0c;顺着你的答案不断深挖&#xff0c;直到问到你不会为止。比如下面这个问题&#xff0c;就是非常典型的一道高并发稳定…

作者头像 李华
网站建设 2026/10/27 1:47:59

res-downloader 使用教程:4 步把想存的视频从手机屏幕搬进硬盘

res-downloader 使用教程&#xff1a;4 步把想存的视频从手机屏幕搬进硬盘 【免费下载链接】res-downloader 视频号、小程序、抖音、快手、小红书、直播流、m3u8、酷狗、QQ音乐等常见网络资源下载! 项目地址: https://gitcode.com/GitHub_Trending/re/res-downloader 某…

作者头像 李华