web api interface
SpeechRecognition
The SpeechRecognition interface of the Web Speech API is the controller interface for the recognition service; this also handles the SpeechRecognitionEvent sent from the recognition service.
[!NOTE] On some browsers, like Chrome, using Speech Recognition on a web page involves a server-based recognition engine. Your audio is sent to a web service for recognition processing, so it won’t work offline.
Constructor
SpeechRecognition()- : Creates a new
SpeechRecognitionobject.
- : Creates a new
Instance properties
SpeechRecognition also inherits properties from its parent interface, EventTarget.
lang- : Returns and sets the language of the current
SpeechRecognition. If not specified, this defaults to the HTMLlangattribute value, or the user agent’s language setting if that isn’t set either.
- : Returns and sets the language of the current
continuous- : Controls whether continuous results are returned for each recognition, or only a single result. Defaults to single (
false.)
- : Controls whether continuous results are returned for each recognition, or only a single result. Defaults to single (
interimResults- : Controls whether interim results should be returned (
true) or not (false.) Interim results are results that are not yet final (e.g., theisFinalproperty isfalse.)
- : Controls whether interim results should be returned (
maxAlternatives- : Sets the maximum number of
SpeechRecognitionAlternatives provided per result. The default value is 1.
- : Sets the maximum number of
phrasesExperimental- : Sets an array of
SpeechRecognitionPhraseobjects to be used for contextual biasing.
- : Sets an array of
processLocallyExperimental- : Specifies whether speech recognition must be performed locally on the user’s device.
Deprecated properties
The concept of grammar has been removed from the Web Speech API. Related features remain in the specification and are still recognized by supporting browsers for backwards compatibility, but they have no effect on speech recognition services.
grammars- : Returns and sets a collection of
SpeechGrammarobjects that represent the grammars understood by the currentSpeechRecognition.
- : Returns and sets a collection of
Static methods
SpeechRecognition.available()Experimental- : Checks whether the specified languages are available for speech recognition at the given quality level.
SpeechRecognition.install()Experimental- : Installs the required language packs for on-device speech recognition in the specified languages and quality level.
Instance methods
SpeechRecognition also inherits methods from its parent interface, EventTarget.
abort()- : Stops the speech recognition service from listening to incoming audio, and doesn’t attempt to return a
SpeechRecognitionResult.
- : Stops the speech recognition service from listening to incoming audio, and doesn’t attempt to return a
start()- : Starts the speech recognition service to listen for incoming audio (from a microphone or an audio track) and returns the results of that recognition.
stop()- : Stops the speech recognition service from listening for incoming audio and attempts to return a
SpeechRecognitionResultbased on the results captured so far.
- : Stops the speech recognition service from listening for incoming audio and attempts to return a
Events
Listen to these events using addEventListener() or by assigning an event listener to the oneventname property of this interface.
audiostart- : Fired when the user agent has started to capture audio.
audioend- : Fired when the user agent has finished capturing audio.
end- : Fired when the speech recognition service has disconnected.
error- : Fired when a speech recognition error occurs.
nomatch- : Fired when the speech recognition service returns a final result with no significant recognition. This may involve some degree of recognition, which doesn’t meet or exceed the
confidencethreshold.
- : Fired when the speech recognition service returns a final result with no significant recognition. This may involve some degree of recognition, which doesn’t meet or exceed the
result- : Fired when the speech recognition service returns a result — a word or phrase has been positively recognized and this has been communicated back to the app.
soundstart- : Fired when any sound — recognizable speech or not — has been detected.
soundend- : Fired when any sound — recognizable speech or not — has stopped being detected.
speechstart- : Fired when sound that is recognized by the speech recognition service as speech has been detected.
speechend- : Fired when speech recognized by the speech recognition service has stopped being detected.
start- : Fired when the speech recognition service begins listening for audio to recognize.
Examples
In our Speech color changer example, we create a new SpeechRecognition object instance using the SpeechRecognition() constructor.
After some other values have been defined, we then set it so that the recognition service starts when a button is clicked (see start()). When a result has been successfully recognized, the result event fires, we extract the color that was spoken from the event object, and then set the background color of the <html> element to that color.
const recognition = new SpeechRecognition();
recognition.continuous = false;
recognition.lang = "en-US";
recognition.interimResults = false;
recognition.maxAlternatives = 1;
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.");
};
recognition.onresult = (event) => {
const color = event.results[0][0].transcript;
diagnostic.textContent = `Result received: ${color}`;
bg.style.backgroundColor = color;
};