Angular中调用谷歌翻译TTS实现文本转语音遇404错误求助

DevOps 小满

2026-8-16

解决方案：谷歌翻译TTS接口404错误修复

问题原因

谷歌翻译的TTS接口已更新验证逻辑，旧的client=tw-ob参数已被废弃，导致请求返回404。

修复步骤

1. 替换Client参数

将接口URL中的client=tw-ob替换为client=gtx或client=webapp，这两个是当前有效的客户端标识。

修改后的基础代码示例：

playVoice() {
  let audio = new Audio();
  audio.src = `https://translate.google.com/translate_tts?ie=UTF-8&tl=en&client=gtx&q=test`;
  audio.load();
  audio.play();
}

2. 更可靠的Fetch播放方式（推荐）

直接使用Audio对象可能因请求头缺失被拦截，改用Fetch API获取音频Blob后再播放，可模拟浏览器请求头避免限制：

async function playVoice() {
  const text = 'test';
  const encodedText = encodeURIComponent(text);
  const url = `https://translate.google.com/translate_tts?ie=UTF-8&tl=en&client=gtx&q=${encodedText}`;
  
  try {
    const response = await fetch(url, {
      headers: {
        'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36'
      }
    });
    
    if (!response.ok) throw new Error('音频请求失败');
    
    const blob = await response.blob();
    const audioUrl = URL.createObjectURL(blob);
    const audio = new Audio(audioUrl);
    await audio.play();
    URL.revokeObjectURL(audioUrl); // 释放临时资源
  } catch (error) {
    console.error('语音播放失败:', error);
  }
}