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...