La API de Web Speech agrega reconocimiento de voz (voz a texto) y síntesis de voz (texto a voz) a JavaScript. En la publicación se trata brevemente esto último, ya que la API se incorporó recientemente a Chrome 33 (dispositivos móviles y computadoras de escritorio). Si te interesa el reconocimiento de voz, Glen Shires tuvo un excelente comentario hace un tiempo sobre la función de reconocimiento de voz: “Voice Driven Web Apps: Introduction to the Web Speech API”.
Conceptos básicos
El uso más básico de la API de síntesis es pasar el speechSynthesis.speak()
y la declaración:
var msg = new SpeechSynthesisUtterance('Hello World');
window.speechSynthesis.speak(msg);
Sin embargo, también puedes modificar los parámetros para modificar el volumen, la velocidad, el tono, la voz y el idioma:
var msg = new SpeechSynthesisUtterance();
var voices = window.speechSynthesis.getVoices();
msg.voice = voices[10]; // Note: some voices don't support altering params
msg.voiceURI = 'native';
msg.volume = 1; // 0 to 1
msg.rate = 1; // 0.1 to 10
msg.pitch = 2; //0 to 2
msg.text = 'Hello World';
msg.lang = 'en-US';
msg.onend = function(e) {
console.log('Finished in ' + event.elapsedTime + ' seconds.');
};
speechSynthesis.speak(msg);
Configurando una voz
La API también te permite obtener una lista de voces compatibles con el motor:
speechSynthesis.getVoices().forEach(function(voice) {
console.log(voice.name, voice.default ? voice.default :'');
});
Luego, establece una voz diferente estableciendo .voice
en el objeto de expresión:
var msg = new SpeechSynthesisUtterance('I see dead people!');
msg.voice = speechSynthesis.getVoices().filter(function(voice) { return voice.name == 'Whisper'; })[0];
speechSynthesis.speak(msg);
Demostración
En mi charla de Google I/O 2013, "More Awesome Web: features you've already want" (www.moreawesomeweb.com), mostré una demostración similar a Google Now/Siri sobre cómo usar el servicio SpeechRecognition
de la API de Web Speech con la API de Google Translate para traducir automáticamente la entrada del micrófono a otro idioma:
DEMOSTRACIÓN: http://www.moreawesomeweb.com/demos/speech_translate.html
Lamentablemente, usó una API no documentada (y no oficial) para realizar la síntesis de voz. Ahora tenemos la API de Web Speech completa para responder la traducción. Actualicé la demostración para usar la API de síntesis.
Navegadores compatibles
Chrome 33 es totalmente compatible con la API de Web Speech, mientras que Safari para iOS 7 tiene compatibilidad parcial.
Detección de atributos
Dado que los navegadores pueden admitir cada parte de la API de Web Speech por separado (p.ej., el caso con Chromium), te recomendamos que detectes cada función por separado:
if ('speechSynthesis' in window) {
// Synthesis support. Make your web apps talk!
}
if ('SpeechRecognition' in window) {
// Speech recognition support. Talk to your apps!
}