实时语音转录终极方案：useWhisper流式处理功能深度解析

【免费下载链接】use-whisper React hook for OpenAI Whisper with speech recorder, real-time transcription, and silence removal built-in 项目地址: https://gitcode.com/gh_mirrors/us/use-whisper

useWhisper是一款基于React Hook的OpenAI Whisper API工具，集成了语音录制、实时转录和静音去除功能，为开发者提供简单高效的语音转文字解决方案。通过useWhisper，你可以轻松实现实时语音转录功能，提升应用的交互体验和可访问性。

为什么选择useWhisper进行实时语音转录？

在当今快节奏的数字时代，实时语音转录技术正成为越来越多应用的核心功能。无论是视频会议、语音助手还是无障碍服务，都需要高效准确的语音转文字解决方案。useWhisper作为一款专为React应用设计的Hook，具有以下显著优势：

• 简单易用：作为React Hook，useWhisper可以轻松集成到任何React应用中，无需复杂的配置和设置。
• 实时处理：支持流式处理功能，能够在用户说话的同时进行转录，实现真正的实时体验。
• 成本优化：内置静音去除功能，可以有效减少发送到OpenAI API的音频数据量，降低使用成本。
• 高度可定制：提供丰富的配置选项，可以根据具体需求调整转录参数，满足不同场景的使用要求。

useWhisper核心功能深度解析

实时流式转录：打造无缝语音交互体验

useWhisper的流式处理功能是其最引人注目的特性之一。通过设置streaming: true和timeSlice参数，你可以实现每隔指定时间（如1秒）就将音频片段发送到Whisper API进行转录，从而在用户说话的同时实时显示转录结果。

import { useWhisper } from '@chengsokdara/use-whisper'

const App = () => {
  const { transcript } = useWhisper({
    apiKey: process.env.OPENAI_API_TOKEN, // 你的OpenAI API密钥
    streaming: true,
    timeSlice: 1000, // 每1秒发送一次音频片段
    whisperConfig: {
      language: 'en', // 指定转录语言为英语
    },
  })

  return (
    <div>
      <p>{transcript.text}</p>
    </div>
  )
}

这段代码展示了如何使用useWhisper实现实时流式转录。通过设置streaming: true，useWhisper会自动开启流式处理模式，每隔timeSlice（这里设置为1000毫秒）就将录制的音频片段发送到Whisper API进行转录。转录结果会实时更新到transcript.text中，从而实现实时显示的效果。

智能静音去除：优化音频数据，降低使用成本

useWhisper内置了静音去除功能，通过集成ffmpeg-wasp库，可以在将音频发送到Whisper API之前自动去除静音部分。这不仅可以减少发送的数据量，降低API调用成本，还可以提高转录准确性，避免静音部分被误识别为语音。

import { useWhisper } from '@chengsokdara/use-whisper'

const App = () => {
  const { transcript } = useWhisper({
    apiKey: process.env.OPENAI_API_TOKEN, // 你的OpenAI API密钥
    removeSilence: true, // 开启静音去除功能
  })

  return (
    <div>
      <p>{transcript.text}</p>
    </div>
  )
}

通过简单地将removeSilence设置为true，useWhisper就会自动处理音频，去除其中的静音部分。这一功能特别适用于长时间录音或会议记录场景，可以有效减少不必要的API调用，节省成本。

灵活的录音控制：满足多样化使用场景

useWhisper提供了丰富的录音控制选项，可以根据不同的使用场景灵活调整录音行为。例如，你可以设置自动开始录音、持续录音直到用户停止说话等功能。

import { useWhisper } from '@chengsokdara/use-whisper'

const App = () => {
  const { transcript } = useWhisper({
    apiKey: process.env.OPENAI_API_TOKEN, // 你的OpenAI API密钥
    autoStart: true, // 组件挂载后自动开始录音
    nonStop: true, // 持续录音，直到用户停止说话
    stopTimeout: 5000, // 用户停止说话5秒后自动停止录音
  })

  return (
    <div>
      <p>{transcript.text}</p>
    </div>
  )
}

在这段代码中，autoStart: true使得组件挂载后自动开始录音，无需用户手动触发。nonStop: true则开启了持续录音模式，录音会一直进行，直到用户停止说话并超过stopTimeout（这里设置为5000毫秒）后才会自动停止。这种设置非常适合需要长时间连续录音的场景，如会议记录或讲座转录。

useWhisper高级应用：自定义服务器实现安全转录

虽然useWhisper可以直接使用OpenAI API密钥进行转录，但在生产环境中，将API密钥暴露在客户端代码中存在安全风险。useWhisper提供了onTranscribe回调函数，允许你将音频数据发送到自己的服务器，再由服务器调用OpenAI API，从而保护你的API密钥安全。

import { useWhisper } from '@chengsokdara/use-whisper'

const App = () => {
  const onTranscribe = async (blob: Blob) => {
    // 将音频blob转换为base64格式
    const base64 = await new Promise<string | ArrayBuffer | null>((resolve) => {
      const reader = new FileReader()
      reader.onloadend = () => resolve(reader.result)
      reader.readAsDataURL(blob)
    })
    
    // 发送到自定义服务器
    const body = JSON.stringify({ file: base64, model: 'whisper-1' })
    const headers = { 'Content-Type': 'application/json' }
    const { default: axios } = await import('axios')
    const response = await axios.post('/api/whisper', body, { headers })
    const { text } = await response.data
    
    // 返回转录结果
    return { blob, text }
  }

  const { transcript } = useWhisper({ onTranscribe })

  return (
    <div>
      <p>{transcript.text}</p>
    </div>
  )
}

通过这种方式，你的OpenAI API密钥可以安全地存储在服务器端，客户端代码中不会暴露任何敏感信息。同时，你还可以在服务器端添加额外的处理逻辑，如用户认证、请求限流等，进一步增强应用的安全性和可靠性。

快速开始：使用useWhisper构建实时语音转录应用

安装useWhisper

要开始使用useWhisper，首先需要通过npm或yarn安装该包：

npm i @chengsokdara/use-whisper

或者

yarn add @chengsokdara/use-whisper

基本使用示例

以下是一个简单的useWhisper使用示例，展示了如何实现基本的语音录制和转录功能：

import { useWhisper } from '@chengsokdara/use-whisper'

const App = () => {
  const {
    recording,
    speaking,
    transcribing,
    transcript,
    pauseRecording,
    startRecording,
    stopRecording,
  } = useWhisper({
    apiKey: process.env.OPENAI_API_TOKEN, // 你的OpenAI API密钥
  })

  return (
    <div>
      <p>录音中: {recording ? '是' : '否'}</p>
      <p>正在说话: {speaking ? '是' : '否'}</p>
      <p>转录中: {transcribing ? '是' : '否'}</p>
      <p>转录文本: {transcript.text}</p>
      <button onClick={() => startRecording()}>开始录音</button>
      <button onClick={() => pauseRecording()}>暂停录音</button>
      <button onClick={() => stopRecording()}>停止录音</button>
    </div>
  )
}

这个简单的应用展示了useWhisper的基本功能。用户可以通过点击按钮开始、暂停和停止录音，应用会实时显示录音状态、说话状态和转录状态，并在转录完成后显示转录文本。

自定义Whisper API配置

useWhisper允许你通过whisperConfig参数自定义Whisper API的行为，如指定转录语言、设置温度参数等：

import { useWhisper } from '@chengsokdara/use-whisper'

const App = () => {
  const { transcript } = useWhisper({
    apiKey: process.env.OPENAI_API_TOKEN, // 你的OpenAI API密钥
    whisperConfig: {
      prompt: '之前的对话内容', // 提供上下文提示
      response_format: 'text', // 指定输出格式为纯文本
      temperature: 0.8, // 设置温度参数，控制输出随机性
      language: 'es', // 指定转录语言为西班牙语
    },
  })

  return (
    <div>
      <p>{transcript.text}</p>
    </div>
  )
}

通过调整这些参数，你可以进一步优化转录结果，使其更符合你的应用需求。

总结：useWhisper引领实时语音转录新体验

useWhisper作为一款强大的React Hook，为开发者提供了简单、高效的实时语音转录解决方案。通过其流式处理功能，你可以实现真正的实时语音转文字体验；内置的静音去除功能可以帮助你优化音频数据，降低API调用成本；而灵活的配置选项和自定义服务器支持，则让useWhisper能够适应各种复杂的使用场景。

无论你是构建视频会议应用、开发语音助手，还是为无障碍服务提供支持，useWhisper都能成为你的得力助手。立即尝试使用useWhisper，开启你的实时语音转录之旅吧！

要开始使用useWhisper，只需克隆仓库并按照文档进行配置：

git clone https://gitcode.com/gh_mirrors/us/use-whisper

探索useWhisper的更多功能，解锁语音交互的无限可能！

【免费下载链接】use-whisper React hook for OpenAI Whisper with speech recorder, real-time transcription, and silence removal built-in 项目地址: https://gitcode.com/gh_mirrors/us/use-whisper