Các ứng dụng web trò chuyện – Giới thiệu về API Tổng hợp giọng nói

Web Speech API thêm tính năng nhận dạng giọng nói (lời nói sang văn bản) và tổng hợp lời nói (văn bản sang lời nói) vào JavaScript. Bài đăng này trình bày ngắn gọn về API này, vì API này gần đây đã ra mắt trong Chrome 33 (dành cho thiết bị di động và máy tính). Nếu bạn quan tâm đến tính năng nhận dạng giọng nói, Glen Shires đã viết một bài viết tuyệt vời về tính năng nhận dạng giọng nói, "Ứng dụng web do giọng nói điều khiển: Giới thiệu về Web Speech API".

Thông tin cơ bản

Cách sử dụng cơ bản nhất của API tổng hợp là truyền speechSynthesis.speak() và lời nói:

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

Tuy nhiên, bạn cũng có thể thay đổi các tham số để ảnh hưởng đến âm lượng, tốc độ lời nói, độ cao, giọng nói và ngôn ngữ:

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

Thiết lập giọng nói

API này cũng cho phép bạn xem danh sách giọng nói mà công cụ hỗ trợ:

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

Sau đó, hãy đặt một giọng nói khác bằng cách đặt .voice trên đối tượng câu lệnh:

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

Bản minh hoạ

Trong bài nói chuyện tại Google I/O 2013, "More Awesome Web: features you've always wanted" (www.moreawesomeweb.com), tôi đã trình bày một bản minh hoạ tương tự như Google Now/Siri về cách sử dụng dịch vụ SpeechRecognition của API Web Speech với API Google Dịch để tự động dịch dữ liệu đầu vào từ micrô sang ngôn ngữ khác:

BẢN MINH HOẠ: http://www.moreawesomeweb.com/demos/speech_translate.html

Rất tiếc, ứng dụng này đã sử dụng một API không được ghi nhận (và không chính thức) để thực hiện việc tổng hợp lời nói. Bây giờ, chúng ta đã có đầy đủ Web Speech API để đọc lại bản dịch! Tôi đã cập nhật bản minh hoạ để sử dụng API tổng hợp.

Hỗ trợ trình duyệt

Chrome 33 hỗ trợ đầy đủ Web Speech API, trong khi Safari cho iOS7 chỉ hỗ trợ một phần.

Phát hiện tính năng

Vì các trình duyệt có thể hỗ trợ riêng từng phần của API Nhận dạng lời nói trên web (ví dụ: trường hợp với Chromium), nên bạn nên phát hiện riêng từng tính năng:

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

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