Streaming aan clientzijde | ElevenLabs Documentation

Stapsgewijze handleiding · Hierbij gaan we ervan uit dat je de Speech to Text- snelstartgids hebt voltooid.

Overzicht

Met de ElevenLabs Realtime Speech to Text API kun je audiostreams in realtime en met uiterst lage latentie transcriberen met het model Scribe Realtime v2. Of je nu spraakassistenten, transcriptieservices of een applicatie bouwt die live spraakherkenning vereist, deze WebSocket-gebaseerde API levert gedeeltelijke transcripts terwijl je spreekt en definitieve transcripts zodra spraaksegmenten zijn voltooid.

Je kunt Scribe v2 Realtime aan clientzijde implementeren om audio in realtime te transcriberen, via de microfoon of door de audio handmatig in chunks te verdelen.

De implementatie aan clientzijde verschilt op een paar manieren van die aan serverzijde:

Vereist een token voor eenmalig gebruik: dit is een tijdelijk token waarmee je verbinding kunt maken met de API zonder je API-sleutel bloot te geven.
Audio van de microfoon kan rechtstreeks naar de API worden gestuurd om te transcriberen, zonder de audio handmatig in chunks te verdelen.

Zie voor het streamen van audio vanaf een URL de handleiding Streaming aan serverzijde.

Snelstart

In deze handleiding gaan we ervan uit dat je je API-sleutel hebt ingesteld. Voltooi eerst de snelstartgids als je dat nog niet hebt gedaan.

Installeer de SDK

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

Maak een token

Om de SDK aan clientzijde te gebruiken, moet je een token voor eenmalig gebruik maken. Dit is een tijdelijk token waarmee je verbinding kunt maken met de API zonder je API-sleutel bloot te geven. Je kunt dit via de ElevenLabs API aan serverzijde doen.

Geef je API-sleutel nooit bloot aan de 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);
});

Een token voor eenmalig gebruik verloopt automatisch na 15 minuten.

Start de transcriptiesessie

Je kunt transcriberen via de microfoon of door je eigen audio handmatig in chunks te verdelen. Je eigen audio kan een bestand of een stream zijn.

Raadpleeg voor een volledige lijst met parameters en opties die de API ondersteunt de API-referentie.

Microfoon

Audio handmatig in chunks verdelen

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>
  );
}

Volgende stappen

Streaming aan serverzijde

Transcribeer audiostreams aan serverzijde met dezelfde WebSocket API.

Transcripts en commitstrategieën

Bepaal wanneer transcripts worden vastgelegd en hoe je gedeeltelijke resultaten verwerkt.