Lobe TTS 入门指南 - 高质量可靠的服务器和浏览器 TTS/STT 库

lobe-tts

Lobe TTS 入门指南 - 高质量可靠的服务器和浏览器 TTS/STT 库

Lobe TTS 是一个高质量、可靠的文本转语音(TTS)和语音转文本(STT)库，支持在服务器端和浏览器端使用。它由 LobeHub 团队开发，旨在为开发者提供强大而易用的语音合成工具。本文将介绍 Lobe TTS 的主要特性、使用方法和相关资源，帮助您快速上手这个出色的 TTS/STT 库。

主要特性

服务器端和浏览器端支持
高质量的语音合成能力
支持多种 TTS 服务，包括 EdgeSpeechTTS、MicrosoftTTS、OpenAITTS 和 OpenAISTT
React 组件和 Hooks 支持
丰富的音频控制功能和可视化组件

快速开始

安装

使用 npm 安装 Lobe TTS：

npm install @lobehub/tts

服务器端使用示例

以下是一个使用 EdgeSpeechTTS 生成语音的简单示例：

import { EdgeSpeechTTS } from '@lobehub/tts';
import { Buffer } from 'buffer';
import fs from 'fs';
import path from 'path';

// 初始化 EdgeSpeechTTS
const tts = new EdgeSpeechTTS({ locale: 'en-US' });

// 创建语音合成请求
const payload = {
  input: 'This is a speech demonstration',
  options: {
    voice: 'en-US-GuyNeural',
  },
};

// 调用 create 方法合成语音
const response = await tts.create(payload);

// 生成语音文件
const mp3Buffer = Buffer.from(await response.arrayBuffer());
const speechFile = path.resolve('./speech.mp3');

fs.writeFileSync(speechFile, mp3Buffer);

浏览器端使用示例

Lobe TTS 提供了易用的 React 组件和 Hooks，以下是一个使用 AudioPlayer 和 AudioVisualizer 的示例：

import { AudioPlayer, AudioVisualizer, useAudioPlayer } from '@lobehub/tts/react';

export default () => {
  const { ref, isLoading, ...audio } = useAudioPlayer(url);

  return (
    <Flexbox align={'center'} gap={8}>
      <AudioPlayer audio={audio} isLoading={isLoading} style={{ width: '100%' }} />
      <AudioVisualizer audioRef={ref} isLoading={isLoading} />
    </Flexbox>
  );
};