微信小程序通過websocket實(shí)時(shí)語(yǔ)音識(shí)別的實(shí)現(xiàn)代碼
之前在研究百度的實(shí)時(shí)語(yǔ)音識(shí)別,并應(yīng)用到了微信小程序中,寫篇文章分享一下。
先看看完成的效果吧
前置條件
申請(qǐng)百度實(shí)時(shí)語(yǔ)音識(shí)別key 百度AI接入指南
創(chuàng)建小程序
設(shè)置小程序錄音參數(shù)
在index.js中輸入
const recorderManager = wx.getRecorderManager() const recorderConfig = { duration: 600000, frameSize: 5, //指定當(dāng)錄音大小達(dá)到5KB時(shí)觸發(fā)onFrameRecorded format: 'PCM', //文檔中沒寫這個(gè)參數(shù)也可以觸發(fā)onFrameRecorded的回調(diào),不過樓主親測(cè)可以使用 sampleRate: 16000, encodeBitRate: 96000, numberOfChannels: 1 }
使用websocket連接
linkSocket() { let _this = this //這里的sn是百度實(shí)時(shí)語(yǔ)音用于排查日志,這里我圖方便就用時(shí)間戳了 let sn = new Date().getTime() wx.showLoading({ title: '識(shí)別中...' }) recorderManager.start(recorderConfig) //開啟鏈接 wx.connectSocket({ url: 'wss://vop.baidu.com/realtime_asr?sn=' + sn, protocols: ['websocket'], success() { console.log('連接成功') _this.initEventHandle() } }) }, //監(jiān)聽websocket返回的數(shù)據(jù) initEventHandle() { let _this = this wx.onSocketMessage((res) => { let result = JSON.parse(res.data.replace('\n','')) if(result.type == 'MID_TEXT'){ _this.tran(result.result, 'value') _this.setData({ textDis: 'none', value: result.result, }) } if(result.type == 'FIN_TEXT'){ let value = _this.data.text let tranStr = value + result.result _this.tran(tranStr, 'text') _this.setData({ value: '', valueEn: '', textDis: 'block', text: tranStr, }) } }) wx.onSocketOpen(() => //發(fā)送數(shù)據(jù)幀 _this.wsStart() console.log('WebSocket連接打開') }) wx.onSocketError(function (res) { console.log('WebSocket連接打開失敗') }) wx.onSocketClose(function (res) { console.log('WebSocket 已關(guān)閉!') }) },
發(fā)送開始、音頻數(shù)據(jù)、結(jié)束幀
wsStart() { let config = { type: "START", data: { appid: XXXXXXXXX,//百度實(shí)時(shí)語(yǔ)音識(shí)別appid appkey: "XXXXXXXXXXXXXXXXXX",//百度實(shí)時(shí)語(yǔ)音識(shí)別key dev_pid: 15372, cuid: "cuid-1", format: "pcm", sample: 16000 } } wx.sendSocketMessage({ data:JSON.stringify(config), success(res){ console.log('發(fā)送開始幀成功') } }) }, wsSend(data){ wx.sendSocketMessage({ data:data, success(res){ console.log('發(fā)送數(shù)據(jù)幀成功') } }) }, wsStop(){ let _this = this this.setData({ click: true, }) _this.stop() let config = { type: "FINISH" } wx.hideLoading() recorderManager.stop() wx.sendSocketMessage({ data:JSON.stringify(config), success(res){ console.log('發(fā)送結(jié)束幀成功') } }) },
小程序錄音回調(diào)
onShow: function () { let _this = this recorderManager.onFrameRecorded(function (res){ let data = res.frameBuffer _this.wsSend(data) }) recorderManager.onInterruptionBegin(function (res){ console.log('錄音中斷') _this.wsStopForAcc() }) recorderManager.onStop(function (res){ console.log('錄音停止') }) },
到此這篇關(guān)于微信小程序通過websocket實(shí)時(shí)語(yǔ)音識(shí)別的實(shí)現(xiàn)代碼的文章就介紹到這了,更多相關(guān)微信小程序websocket實(shí)時(shí)語(yǔ)音識(shí)別內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
javascript驗(yàn)證完全方法具體實(shí)現(xiàn)
下面這段代碼完全實(shí)現(xiàn)了判斷是否合格.傳入號(hào)碼就行了,包括了算法,下面的是用Ext實(shí)現(xiàn)的,但是基于javascript的語(yǔ)法居多,基本都可以用2013-11-11layui中的switch開關(guān)實(shí)現(xiàn)方法
今天小編就為大家分享一篇layui中的switch開關(guān)實(shí)現(xiàn)方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-09-09JS數(shù)組操作大全對(duì)象數(shù)組根據(jù)某個(gè)相同的字段分組
這篇文章主要介紹了JS數(shù)組操作大全對(duì)象數(shù)組根據(jù)某個(gè)相同的字段分組,需要注意的是,在開發(fā)過程這種數(shù)組的處理函數(shù),應(yīng)當(dāng)被編寫到項(xiàng)目的公共工具函數(shù)庫(kù)中全局調(diào)用,本文結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì),需要的朋友可以參考下2022-11-11微信小程序?qū)崿F(xiàn)可拖動(dòng)懸浮圖標(biāo)(包括按鈕角標(biāo)的實(shí)現(xiàn))
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)可拖動(dòng)懸浮圖標(biāo)(包括按鈕角標(biāo)的實(shí)現(xiàn)),本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-12-12基于JS實(shí)現(xiàn)bookstore靜態(tài)頁(yè)面的實(shí)例代碼
本文給大家分享一段核心代碼基于js實(shí)現(xiàn)的bookstore靜態(tài)頁(yè)面,代碼簡(jiǎn)單易懂,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友參考下2017-02-02微信小程序?qū)崿F(xiàn)卡片左右滑動(dòng)效果的示例代碼
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)卡片左右滑動(dòng)效果的示例代碼,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05JavaScript中使用sencha gridpanel 編輯單元格、改變單元格顏色
ExtJS中的表格功能非常強(qiáng)大,包括了排序、緩存、拖動(dòng)、隱藏某一列、自動(dòng)顯示行號(hào)、列匯總、單元格編輯等實(shí)用功能,通過本篇文章給大家介紹JavaScript中使用sencha gridpanel 編輯單元、改變單元格顏色,感興趣的朋友一起學(xué)習(xí)2015-11-11