W3cubDocs

/Web APIs

Web Speech API

The Web Speech API enables you to incorporate voice data into web apps. The Web Speech API has two parts: SpeechSynthesis (Text-to-Speech), and SpeechRecognition (Asynchronous Speech Recognition.)

Web Speech Concepts and Usage

The Web Speech API makes web apps able to handle voice data. There are two components to this API:

Speech recognition is accessed via the SpeechRecognition interface, which provides the ability to recognize voice context from an audio input (normally via the device's default speech recognition service) and respond appropriately. Generally you'll use the interface's constructor to create a new SpeechRecognition object, which has a number of event handlers available for detecting when speech is input through the device's microphone. The SpeechGrammar interface represents a container for a particular set of grammar that your app should recognize. Grammar is defined using JSpeech Grammar Format (JSGF.)
Speech synthesis is accessed via the SpeechSynthesis interface, a text-to-speech component that allows programs to read out their text content (normally via the device's default speech synthesizer.) Different voice types are represented by SpeechSynthesisVoice objects, and different parts of text that you want to be spoken are represented by SpeechSynthesisUtterance objects. You can get these spoken by passing them to the SpeechSynthesis.speak() method.

For more details on using these features, see Using the Web Speech API.

Web Speech API Interfaces

Speech recognition

SpeechRecognition: The controller interface for the recognition service; this also handles the SpeechRecognitionEvent sent from the recognition service.
SpeechRecognitionAlternative: Represents a single word that has been recognized by the speech recognition service.
SpeechRecognitionErrorEvent: Represents error messages from the recognition service.
SpeechRecognitionEvent: The event object for the result and nomatch events, and contains all the data associated with an interim or final speech recognition result.
SpeechGrammar: The words or patterns of words that we want the recognition service to recognize.
SpeechGrammarList: Represents a list of SpeechGrammar objects.
SpeechRecognitionResult: Represents a single recognition match, which may contain multiple SpeechRecognitionAlternative objects.
SpeechRecognitionResultList: Represents a list of SpeechRecognitionResult objects, or a single one if results are being captured in continuous mode.

Speech synthesis

SpeechSynthesis: The controller interface for the speech service; this can be used to retrieve information about the synthesis voices available on the device, start and pause speech, and other commands besides.
SpeechSynthesisErrorEvent: Contains information about any errors that occur while processing SpeechSynthesisUtterance objects in the speech service.
SpeechSynthesisEvent: Contains information about the current state of SpeechSynthesisUtterance objects that have been processed in the speech service.
SpeechSynthesisUtterance: Represents a speech request. It contains the content the speech service should read and information about how to read it (e.g., language, pitch and volume.)
SpeechSynthesisVoice: Represents a voice that the system supports. Every SpeechSynthesisVoice has its own relative speech service including information about language, name and URI.
Window.speechSynthesis: Specified out as part of a [NoInterfaceObject] interface called SpeechSynthesisGetter, and Implemented by the Window object, the speechSynthesis property provides access to the SpeechSynthesis controller, and therefore the entry point to speech synthesis functionality.

Errors

For information on errors reported by the Speech API (for example, "language-not-supported" and "language-unavailable"), see the following documentation:

Examples

The Web Speech API examples on GitHub contains demos to illustrate speech recognition and synthesis.

Specifications

Specification
Web Speech API> # speechreco-section>
Web Speech API> # tts-section>

Browser compatibility

api.SpeechRecognition

	Desktop					Mobile
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari on IOS	Samsung Internet	WebView Android	WebView on iOS
`SpeechRecognition`	13933	13979	No	No	14.1	13933	No	No	14.5	2.0	37	14.5
`Web_Speech_API`	139 33 You'll need to serve your code through a web server for recognition to work.	139 79 You'll need to serve your code through a web server for recognition to work.	No	123 20 You'll need to serve your code through a web server for recognition to work.	14.1	139 33 You'll need to serve your code through a web server for recognition to work.	No	91 20 You'll need to serve your code through a web server for recognition to work.	14.5	2.0 You'll need to serve your code through a web server for recognition to work.	139 4.4.3 You'll need to serve your code through a web server for recognition to work.	14.5
`abort`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`audioend_event`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`audiostart_event`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`available_static`	139	139	No	123	No	139	No	91	No	No	139	No
`continuous`	33	79	No	20	14.1	No The property can be set, but has no effect.	No	No The property can be set, but has no effect.	14.5	No The property can be set, but has no effect.	No The property can be set, but has no effect.	14.5
`end_event`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`error_event`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`grammars`	33	79	No	20	No	33	No	20	No	2.0	4.4.3	No
`install_static`	139	139	No	123	No	139	No	91	No	No	139	No
`interimResults`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`lang`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`maxAlternatives`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`nomatch_event`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`processLocally`	139	139	No	123	No	139	No	91	No	No	139	No
`result_event`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`soundend_event`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`soundstart_event`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`speechend_event`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`speechstart_event`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`start`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`start_event`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5
`stop`	33	79	No	20	14.1	33	No	20	14.5	2.0	4.4.3	14.5

api.SpeechSynthesis

	Desktop					Mobile
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari on IOS	Samsung Internet	WebView Android	WebView on iOS
`Web_Speech_API`	33	14	49	21	7	33	62	No	7	3.0	No	7
`cancel`	33	14	49	21	7	33	62	No	7	3.0	No	7
`getVoices`	33	14	49	21	7	33	62	No	7	3.0	No	7
`pause`	33	14	49	21	7	33 In Android, `pause()` ends the current utterance. `pause()` behaves the same as `cancel()`.	62 In Android, `pause()` ends the current utterance. `pause()` behaves the same as `cancel()`.	No	7	3.0 In Android, `pause()` ends the current utterance. `pause()` behaves the same as `cancel()`.	No	7
`paused`	33	14	49	21	7	33	62	No	7	3.0	No	7
`pending`	33	14	49	21	7	33	62	No	7	3.0	No	7
`resume`	33	14	49	21	7	33	62	No	7	3.0	No	7
`speak`	33	14	49	21	7	33	62	No	7	3.0	No	7
`speaking`	33	14	49	21	7	33	62	No	7	3.0	No	7
`voiceschanged_event`	33	14	49	21	16	33	62	No	16	3.0	No	16