淺析如何利用JavaScript進(jìn)行語音識別
更新時間：2016年10月27日 08:45:01 投稿：daisy
所謂語音識別就是將你所說的轉(zhuǎn)化成文字。Chrome 瀏覽器在版本25之后開始對這一特性的支持。這篇文章將會詳細(xì)的介紹如何使用JavaScript進(jìn)行語音識別，感興趣的朋友們可以參考借鑒，下面來一起看看吧。
一、基礎(chǔ)用法
var recognition = new webkitSpeechRecognition();
recognition.onresult = function(event) {
console.log(event)
}
recognition.start();
這里操作實際會讓用戶授權(quán)頁面開啟麥克風(fēng)，如果用戶允許的話，用戶可以開始說話了，如果你停說話了，onresult注冊的時間 則會被觸發(fā)，并會講捕獲的音頻返回成一個JavaScript對象。
二、響應(yīng)流
你需要等待用戶準(zhǔn)備好對話，并且知道對話結(jié)束；
var recognition = new webkitSpeechRecognition();
recognition.continuous = true;
recognition.interimResults = true;
recognition.onresult = function(event) {
console.log(event)
}
recognition.start();
這樣你可以在用戶開始講話時，提前渲染結(jié)果。
你可以自動以識別的語言，默認(rèn)情況為所在地區(qū)語言。
三、x-webkit-speech
Webkit 內(nèi)核的瀏覽器支持語音輸入
<input type="text" x-webkit-speech />
它會識別音頻并進(jìn)行轉(zhuǎn)化為文字
四、安全性
http協(xié)議下瀏覽器每次都會提醒用戶去確認(rèn)語音操作，然而https的頁面，沒有這樣一個麻煩的操作。
JavaScript上下文，整個頁面，都能過訪問到捕獲的音頻。
總結(jié)
JavaScript的語音識別總體還并未大范圍使用，而且受限于瀏覽器支持，因此只有少數(shù)需求或許能夠使用到吧。以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助，如果有疑問大家可以留言交流。
相關(guān)文章
再談javascript圖片預(yù)加載技術(shù)(詳細(xì)演示)
由于javascript無法獲取img文件頭數(shù)據(jù)，必須等待其加載完畢后才能獲取真實的大小，所以lightbox類效果為了讓圖片居中顯示，導(dǎo)致其速度體驗要比直接輸出的差很多。2011-03-03
echarts學(xué)習(xí)筆記之圖表自適應(yīng)問題詳解
最近發(fā)現(xiàn)一個問題，echarts圖初始化后不能自適應(yīng)瀏覽器的縮放，所以下面這篇文章就來給大家介紹了關(guān)于echarts圖表自適應(yīng)問題的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，需要的朋友可以參考借鑒，下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2017-11-11
這篇文章主要介紹了微信小程序自定義菜單切換欄tabbar組件代碼實例,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-12-12
這篇文章主要介紹了ES6之模版字符串的具體使用，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-05-05
做了一個判斷瀏覽器類型和版本號的業(yè)務(wù)，記錄下相關(guān)的js代碼，個人感覺還不錯，需要的朋友可以參考下2013-10-10
這篇文章主要介紹了JS實現(xiàn)很酷的EMAIL地址添加功能,實例分析了javascript操作text文本的技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-02-02
本文主要介紹了JS支付頁面倒計時的實現(xiàn)示例，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-03-03
javascript如何用遞歸寫一個簡單的樹形結(jié)構(gòu)示例
本篇文章主要介紹了javascript如何用遞歸寫一個簡單的樹形結(jié)構(gòu)示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
uniapp使用webview嵌入vue頁面及通信實現(xiàn)方式
項目中有需要嵌入其他H5的頁面的業(yè)務(wù)需求,這篇文章主要給大家介紹了關(guān)于uniapp使用webview嵌入vue頁面及通信實現(xiàn)方式的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-01-01
JS的encodeURI和java的URLDecoder.decode使用介紹
如果不想在url中看到有明文可以使用js的encodeURI的URLDecoder.decode一起使用一起來把url加密下，下面有個不錯的示例，大家不妨參考下2014-05-05