Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

SpeechRecognition: start() Methode

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Die start() Methode der Web Speech API startet den Spracherkennungsdienst, um eingehende Audiodaten (von einem Mikrofon oder einer Audiospur) zu hören und gibt die Ergebnisse dieser Erkennung zurück.

Syntax

js
start()
start(audioTrack)

Parameter

audioTrack Optional Experimentell

Eine MediaStreamTrack Instanz, auf der die Spracherkennung durchgeführt werden soll. Falls nicht spezifiziert, versucht der Dienst, Audio vom Mikrofon des Nutzers zu erkennen.

Rückgabewert

Keiner (undefined).

Ausnahmen

InvalidStateError DOMException

Wird ausgelöst, wenn ein audioTrack angegeben ist und eine oder beide der folgenden Bedingungen zutreffen:

  • Die kind Eigenschaft der Spur ist nicht audio.
  • Die readyState Eigenschaft der Spur ist nicht live.

Beispiele

Spracherkennung von einem Mikrofon

In unserem Speech color changer Beispiel erstellen wir eine neue Instanz des SpeechRecognition Objekts mit dem SpeechRecognition() Konstruktor. Später erstellen wir einen click Ereignis-Handler auf einem <button>, sodass, wenn darauf geklickt wird, der Spracherkennungsdienst gestartet wird und auf Audioeingaben des Mikrofons des Nutzers gewartet wird:

js
const recognition = new SpeechRecognition();

const diagnostic = document.querySelector(".output");
const bg = document.querySelector("html");
const startBtn = document.querySelector("button");

startBtn.onclick = () => {
  recognition.start();
  console.log("Ready to receive a color command.");
};

Wenn ein Ergebnis erfolgreich erkannt wurde, wird das result Ereignis ausgelöst. Wir extrahieren die gesprochene Farbe aus dem Ereignisobjekt, indem wir das transcript der ersten SpeechRecognitionAlternative des ersten SpeechRecognitionResult in der zurückgegebenen results Liste erfassen. Anschließend setzen wir die Hintergrundfarbe des <html> Elements auf diese Farbe.

js
recognition.onresult = (event) => {
  const color = event.results[0][0].transcript;
  diagnostic.textContent = `Result received: ${color}`;
  bg.style.backgroundColor = color;
};

Spracherkennung von einer Audiospur

Dieser Code (aus unserem audio track recognition demo) zeigt, wie man Sprache von einer Audiospur erkennt. Zunächst erstellen wir eine neue SpeechRecognition Instanz und setzen dessen lang auf en-US. Dann holen wir uns eine Referenz auf ein <button> Element und ein <p> Element, um Ergebnisse und Diagnoseinformationen auszugeben.

js
const recognition = new SpeechRecognition();
recognition.lang = "en-US";

const startBtn = document.querySelector("button");
const diagnostic = document.querySelector(".output");

Als Nächstes fügen wir dem <button> einen click Ereignis-Handler hinzu. Wenn darauf geklickt wird, erstellen wir ein neues <audio> Element mit dem Audio() Konstruktor und laden eine MP3-Datei in dieses. Sobald die MP3-Datei abspielbereit ist (bestimmt durch das canplay Ereignis), erfassen wir sie als MediaStream mit der captureStream() Methode und extrahieren den Audio MediaStreamTrack mit getAudioTracks().

Dann spielen wir das Audio ab (erforderlich für die Erkennung) und übergeben den MediaStreamTrack an die start() Methode, um die Erkennung zu starten.

js
startBtn.addEventListener("click", () => {
  diagnostic.textContent = "";
  console.log("Loading audio track");
  const audioElement = new Audio("cheese-on-toast.mp3");
  audioElement.addEventListener("canplay", () => {
    const stream = audioElement.captureStream();
    const audioTrack = stream.getAudioTracks()[0];
    audioElement.play();
    recognition.start(audioTrack);
    console.log("Recognition started");
  });
});

Um das erkannte Audio auszugeben, hören wir auf das result Ereignis. Wenn dieses ausgelöst wird, erfassen wir das transcript der ersten SpeechRecognitionAlternative des ersten SpeechRecognitionResult in der zurückgegebenen results Liste. Wir geben das Transkript selbst im Ausgabe-<p> aus und protokollieren dessen Vertrauenswürdigkeitsbewertung in der Konsole.

js
recognition.addEventListener("result", (event) => {
  const speech = event.results[0][0].transcript;
  diagnostic.textContent = `Speech recognized: ${speech}.`;
  console.log(`Confidence: ${event.results[0][0].confidence}`);
});

Spezifikationen

Specification
Web Speech API
# dom-speechrecognition-start

Browser-Kompatibilität

Siehe auch