前端如何使用大模型API ? 竟然如此简单！

让文字开口说话：用大模型 API 实现 TTS

在当今人工智能应用中，让文字“开口说话”是非常常见且实用的功能，无论是语音助手、智能客服，还是有声阅读，都离不开文本转语音（TTS）技术。本篇将以智谱 AI（ZHIPU AI）开放平台提供的 TTS API 为例，讲解如何用简单的接口完成文本转语音。

官网地址：文本转语音 - Bigmodel

一、API 接口概览（官方文档）

根据官方文档，该接口的调用方式如下：

curl --request POST \
  --url https://open.bigmodel.cn/api/paas/v4/audio/speech \
  --header 'Authorization: Bearer <token>' \
  --header 'Content-Type: application/json' \
  --data '{
    "model": "cogtts",
    "input": "<string>",
    "voice": "tongtong"
  }'

• 接口地址：https://open.bigmodel.cn/api/paas/v4/audio/speech

• HTTP 方法：POST

• Headers：

  • Authorization: Bearer <your API token>
  • Content-Type: application/json

• Body 参数：

  • model：使用的 TTS 模型（如 "cogtts"）
  • input：待转换的文本内容，例如 "您好，世界！"
  • voice：声音风格或角色，比如 "tongtong" (docs.bigmodel.cn)

• 返回结果类型：音频文件（audio/*），通常以二进制形式返回 (docs.bigmodel.cn)

• 下面这张图帮助我们更好理解

---

二、代码实战：用 Fetch 调用 TTS 接口

下面是一段典型的 JavaScript 编辑端示例代码：

const url = 'https://open.bigmodel.cn/api/paas/v4/audio/speech';
const options = {
  method: 'POST',
  headers: {
    Authorization: 'Bearer <YOUR_API_TOKEN>',
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    model: 'cogtts',
    input: '你好，欢迎使用文本转语音功能。',
    voice: 'tongtong',
  }),
};

try {
  const response = await fetch(url, options);
  if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
  const arrayBuffer = await response.arrayBuffer(); // 获取音频二进制
  const blob = new Blob([arrayBuffer], { type: response.headers.get('Content-Type') });
  const audioUrl = URL.createObjectURL(blob);
  const audio = new Audio(audioUrl);
  audio.play();
} catch (error) {
  console.error('TTS 请求失败：', error);
}

核心步骤解析：

步骤	说明
构建请求	设置 method、headers 与 body，body 使用 JSON.stringify 序列化
发起请求	使用 fetch 发送 POST 请求
处理响应	如果成功，用 arrayBuffer() 获取原始二进制数据
播放音频	将二进制数据封装成 Blob，生成可播放的音频 URL (createObjectURL)，并用 Audio 播放

---

四、实践建议与注意事项

• 字符编码：确保传输的文本为 UTF-8 编码，避免中文乱码。

• token 管理：API token 建议通过环境变量或安全存储方式管理。

• 错误处理：

  • HTTP 级别错误：检查 response.ok 或状态码。
  • API 返回异常：响应内容可能包含错误信息，应打印或记录用于调试。

• 音频格式注意：通过 Content-Type 可以判断返回格式（如 audio/mpeg 或 audio/wav），并据此调整播放设置。

---

总结

本文从 API 文档、JS 实现示例入手，展示了如何调用智谱 AI TTS 接口实现文本转语音功能。无论你是前端开发者还是后端开发者，都可以轻松上手。掌握这些实用技巧后，你就能让文字“会说话”了！

如果你希望进一步了解如何调整语调、情感，或者如何批量生成音频，也欢迎继续交流！