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
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 nichtaudio
. - Die
readyState
Eigenschaft der Spur ist nichtlive
.
- Die
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:
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.
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.
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.
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.
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
Loading…