使用者操作語音提示,Web Speech API 的簡單使用

王子飛發表於2020-10-06

在做快遞業務類網站的時候,經常會接觸到客戶掃描錄入快遞資料的情況,有時候客戶用掃描槍掃描快遞入庫,客戶不在電腦旁,無法及時檢視快遞錄入成功情況,此時使用Web Speech API反饋操作結果就是最好的選擇了。

Web Speech API 使您能夠將語音資料合併到 Web 應用程式中。

Web Speech API 有兩個部分:SpeechSynthesis 語音合成 (文字到語音 TTS)和 SpeechRecognition 語音識別(非同步語音識別)。

我們現在用到的只有 語音合成。使用起來也很方便:

方法一 粗暴

window.speechSynthesis.speak(new window.SpeechSynthesisUtterance("入庫成功"));

方法二 簡單封裝

const speak = (msg) => {
    let ssu = new window.SpeechSynthesisUtterance();
    ssu.lang = 'zh-CN';
    ssu.text = msg;
    window.speechSynthesis.speak(ssu);
}
speak("入庫成功");

參考資料:
speechSynthesis強制使用Chrome中的Google小姐中文語音

本作品採用《CC 協議》,轉載必須註明作者和本文連結

相關文章