Streaming côté client | ElevenLabs Documentation

Guide pratique · Suppose que vous avez terminé le guide de démarrage rapide Speech to Text.

Présentation

L’API Realtime Speech to Text d’ElevenLabs vous permet de transcrire des flux audio en temps réel avec une latence ultra-faible grâce au modèle Scribe Realtime v2. Que vous créiez des assistants vocaux, des services de transcription ou toute application nécessitant une reconnaissance vocale en direct, cette API basée sur WebSocket fournit des transcriptions partielles pendant que vous parlez et des transcriptions validées une fois les segments vocaux terminés.

Scribe v2 Realtime peut être implémenté côté client pour transcrire de l’audio en temps réel, via le microphone ou en segmentant manuellement l’audio.

L’implémentation côté client diffère de celle côté serveur sur plusieurs points :

Elle nécessite un jeton à usage unique, un jeton temporaire permettant de se connecter à l’API sans exposer votre clé API.
L’audio du microphone peut être transmis directement à l’API pour être transcrit, sans devoir le segmenter manuellement.

Pour diffuser de l’audio depuis une URL, consultez le guide Streaming côté serveur.

Démarrage rapide

Ce guide suppose que vous avez configuré votre clé API. Terminez d’abord le démarrage rapide si ce n’est pas encore fait.

Installer le SDK

npm install @elevenlabs/react @elevenlabs/elevenlabs-js

Créer un jeton

Pour utiliser le SDK côté client, vous devez créer un jeton à usage unique. Il s’agit d’un jeton temporaire qui permet de se connecter à l’API sans exposer votre clé API. Vous pouvez le créer via l’API ElevenLabs côté serveur.

N’exposez jamais votre clé API au client.

// Node.js server
import { ElevenLabsClient } from "@elevenlabs/elevenlabs-js";
const elevenlabs = new ElevenLabsClient({
  apiKey: process.env.ELEVENLABS_API_KEY,
});
app.get("/scribe-token", yourAuthMiddleware, async (req, res) => {
  const token = await elevenlabs.tokens.singleUse.create("realtime_scribe");
  res.json(token);
});

Un jeton à usage unique expire automatiquement après 15 minutes.

Démarrer la session de transcription

La transcription peut être effectuée via le microphone ou en segmentant manuellement votre propre audio. Cet audio peut provenir d’un fichier ou d’un flux.

Pour obtenir la liste complète des paramètres et options pris en charge par l’API, consultez le Guide de l’API.

Microphone

Segmentation manuelle de l’audio

import { useScribe } from "@elevenlabs/react";
function MyComponent() {
  const scribe = useScribe({
    modelId: "scribe_v2_realtime",
    onPartialTranscript: (data) => {
      console.log("Partial:", data.text);
    },
    onCommittedTranscript: (data) => {
      console.log("Committed:", data.text);
    },
    onCommittedTranscriptWithTimestamps: (data) => {
      console.log("Committed with timestamps:", data.text);
      console.log("Timestamps:", data.words);
    },
  });
  const handleStart = async () => {
    // Fetch a single use token from the server
    const token = await fetchTokenFromServer();
    await scribe.connect({
      token,
      microphone: {
        echoCancellation: true,
        noiseSuppression: true,
      },
    });
  };
  return (
    <div>
      <button onClick={handleStart} disabled={scribe.isConnected}>
        Start Recording
      </button>
      <button onClick={scribe.disconnect} disabled={!scribe.isConnected}>
        Stop
      </button>
      {scribe.partialTranscript && <p>Live: {scribe.partialTranscript}</p>}
      <div>
        {scribe.committedTranscripts.map((t) => (
          <p key={t.id}>{t.text}</p>
        ))}
      </div>
    </div>
  );
}

Étapes suivantes

Streaming côté serveur

Transcrivez des flux audio côté serveur avec la même API WebSocket.

Transcriptions et stratégies de validation

Contrôlez le moment où les transcriptions sont validées et la manière de traiter les résultats partiels.