html5網頁錄音和語音識別


背景

在輸入方式上,人們總是在追尋一種更高效,門檻更低的方式,來降低用戶使用產品的學習成本。語音輸入也是一種嘗試較多的方式,有些直接使用語音(如微信語音聊天),有些需要將語音轉化為文字(語音識別)。接下來的內容是一次在pc瀏覽器上進行語音識別輸入的一種嘗試。 ### 實現 調研階段,chrome是支持語音識別的。它支持了一系列的接口,可以進行語音識別。參考HTML5的Speech API相關標准的現狀
但是使用這些接口有一些困難,連不上服務器。此路不通。

那么,可以使用笨點兒的方法,先錄音再上傳到指定語音識別服務器,進行語音識別。這里使用的是百度語音開放平台(http://yuyin.baidu.com/)的語音識別接口,支持8k,16k的單聲道的wav文件,或者pcm。嘗試了8k的識別效果,跟16k的差了好遠。就使用了16k,單聲道wav文件,上傳到語音識別服務器。

關於錄音,主要步驟就是使用navigator.getUserMedia來獲取用戶的輸入設備,成功之后使用webkitAudioContext來創建音頻實例。在錄音結束之后,將錄音的流導出為文件,上傳即可。錄音的可以參考這個recorder.js,只要稍微做一下修改就可以應用。其中需要處理音頻采樣率,默認的采樣率為44.1k,這里需要做一個轉換,具體方法可以參考HTML5網頁錄音和壓縮,邊猜邊做

在瀏覽器擴展中,沒有明確的方式去獲取用戶對錄音的授權。可以在擴展的optionpage里面申請授權,之后在擴展的所有頁面都有權限了。在較新的chrome瀏覽器里測過可以用。參考這里:How do I give webkitGetUserMedia permission in a Chrome Extension popup window

demo

這里有一個chrome擴展的demo,實現了通過語音采樣,生成wav文件上傳到語音識別服務器的功能。其中做了一個比較簡單的端點檢測,通過音量的大小來確定輸入的完成。
http://github.com/veizz/speec...
一些思考 * demo其實是用來參與公司舉辦的一屆hackathon比賽,主要實現了語音在線識別,文字播報等功能。在后期還有想法加入了一些自然語音處理的功能,可以識別一些輸入指令。如『打開百度首頁』、『上淘寶買衣服』等功能。會打開指定網站,自動填寫輸入詞,執行搜索。還可以做一些小功能,比如說語音輸入『查詢天氣』、『買電影票』等常用功能,在popup的窗口里面打開等。
一切的想法都看起來很美好,但在大家都熟悉了打字輸入的今天,還有多少人願意使用語音識別做為輸入方式?而對於不會打字的人,能否使用標准的普通話來進行語音識別的輸入? * 采樣率的處理是通過js的文件操作來實現的。html5支持的fileapi強大如此,怪不得有人用js做視頻解碼器,不考慮性能的話,看起來很美好啊

參考

http://www.cnblogs.com/jz1108...
https://dvcs.w3.org/hg/speech...
http://codeartists.com/post/3...
http://stackoverflow.com/ques...
http://www.cnblogs.com/blqw/p...
http://ibillxia.github.io/blo...
http://stackoverflow.com/ques...
http://www.web-tinker.com/art...


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM