יישומי אינטרנט של דיבור – מבוא ל-Speech Synthesis API

אריק בידלמן

Web Speech API מוסיף ל-JavaScript זיהוי קולי (דיבור לטקסט) וסינתזת דיבור (המרת טקסט לדיבור). הפוסט עוסק בקצרה בגרסה השנייה, כי ה-API נחת לאחרונה ב-Chrome 33 (לנייד ולמחשב). אם אתם מתעניינים בזיהוי דיבור, Glen Shires מאמר בזמן האחרון על תכונת הזיהוי הקולי, "Voice Based Web Apps: Introduction to Web Speech API".

היסודות

השימוש הבסיסי ביותר ב-API הסינתזה הוא העברת ה-speechSynthesis.speak() והביטוי:

var msg = new SpeechSynthesisUtterance('Hello World');
window.speechSynthesis.speak(msg);

עם זאת, תוכלו גם לשנות את הפרמטרים כדי להשפיע על עוצמת הקול, קצב הדיבור, גובה הטון, הקול והשפה:

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);

הגדרת קול

ה-API מאפשר גם לקבל רשימה של קולות שבהם המנוע תומך:

speechSynthesis.getVoices().forEach(function(voice) {
    console.log(voice.name, voice.default ? voice.default :'');
});

לאחר מכן, כדי להגדיר קול אחר, מגדירים את .voice באובייקט הביטוי:

var msg = new SpeechSynthesisUtterance('I see dead people!');
msg.voice = speechSynthesis.getVoices().filter(function(voice) { return voice.name == 'Whisper'; })[0];
speechSynthesis.speak(msg);

הדגמה (דמו)

בהרצאה של Google I/O לשנת 2013, "More Awesome Web: תכונות שתמיד רצית" (www.moreawesomeweb.com), הצגתי הדגמה דמוית Google Now/Siri על השימוש בשירות SpeechRecognition של Web Speech API באמצעות Google Translate API לצורך תרגום אוטומטי של קלט מיקרופון לשפה אחרת:

הדגמה: http://www.moreawesomeweb.com/demos/speech_translate.html

לרוע המזל, נעשה שימוש ב-API לא מתועד (ולא רשמי) כדי לבצע את סינתזת הדיבור. עכשיו יש לנו את ה-Web Speech API המלא שמאפשר לנו להשמיע את התרגום! עדכנתי את ההדגמה כך שתשתמש ב-API של סינתזה.

תמיכה בדפדפן

ב-Chrome 33 יש תמיכה מלאה ב-Web Speech API, ואילו ב-Safari ל-iOS7 יש תמיכה חלקית.

זיהוי תכונות

מאחר שדפדפנים עשויים לתמוך בנפרד בכל חלק של Web Speech API (למשל, גרסת Chromium), מומלץ להגדיר כל תכונה בנפרד:

if ('speechSynthesis' in window) {
    // Synthesis support. Make your web apps talk!
}

if ('SpeechRecognition' in window) {
    // Speech recognition support. Talk to your apps!
}