html5语音转文字实时语音转文字

w html5 demo:
链接:https://pan.baidu.com/s/1uJ2EO9FNzFsRE69D_t6mI 提取码:19r5

文档

实时转需要开启录音权限,看文档,或者demo

借助第三方语音转文字技术


上传wav格式语音文件转文字

服务端实现ASR自动语音转文字,提供给前端asr服务器地址,然后前端把需要的语音文件以指定格式发送给服务端,服务端返回转换后的结果

html 复制代码
<!-- 原生input也行,第三方ui库也可以 -->
<a-upload
  action="#"
  :limit="1"
  :customRequest="customUploadHandler"
  >
  <a-button>点击上传</el-button>
</a-upload>
js 复制代码
import WebSockerUtil from "xx/xxx/xxx/";//引入ws工具类

let ws = null;

function webSocketInit(){
	//服务端提供的ASR服务地址,进行ws连接,
	ws = new WebSockerUtil('ws:xxx/xxx/xx:1008',messageHandler)
}
webSocketInit();

/**
接收结果
*/
function messageHandler(eventData){
	console.log(eventData,'ws转换结果')
	let resultTxt = '';//结果文字
    let rectxt = "" + JSON.parse(jsonMsg.data)['text'];
    let asrmodel = JSON.parse(jsonMsg.data)['mode'];
    let is_final = JSON.parse(jsonMsg.data)['is_final'];
    let timestamp = JSON.parse(jsonMsg.data)['timestamp'];
    if (asrmodel == "2pass-offline" || asrmodel == "offline") {
        offline_text = offline_text + handleWithTimestamp(rectxt, timestamp); //rectxt; //.replace(/ +/g,"");
        resultTxt  = offline_text;
    } else {
        resultTxt  = rec_text + rectxt; //.replace(/ +/g,"");
    }
}

/**
 自定义上传文件
*/
function  customUploadHandler({file}){
      let fileAudio = new FileReader();
      fileAudio.readAsArrayBuffer(file);
      fileAudio.onload = ()=>{
        let file_data_array = audioblob.result;
//        const audioblob= new Blob([new Uint8Array(file_data_array)], { type: "audio/wav" });
//       const audioSrc = (window.URL || webkitURL).createObjectURL(audioblob);

 	     let sampleBuf = new Uint8Array(file_data_array);
 	     let CHUNK_SIZE = 960; // for asr chunk_size [5, 10, 5]
 	     while (sampleBuf.length >= chunk_size) {
             let sendBuf = sampleBuf.slice(0, CHUNK_SIZE);
              sampleBuf = sampleBuf.slice(CHUNK_SIZE, sampleBuf.length);
              ws.send(sendBuf);
          }
          
          //stop
          let chunk_size = new Array(5, 10, 5);
          	 var request = {
       			 "chunk_size": chunk_size,
        		 "wav_name": "h5",
        		 "is_speaking": false,
        		 "chunk_interval": 10,
        		 "mode": 'offline',
    		};
    		if (sampleBuf.length > 0) {
        		ws.send(sampleBuf);
    		    sampleBuf = new Int16Array();
   			 }
   			 ws.send(JSON.stringify(request));
      }
}
相关推荐
ankleless1 小时前
C语言(12)——进阶函数
前端·html
码码哈哈爱分享1 小时前
Tauri 框架介绍
css·rust·vue·html
David WangYang5 小时前
基于 IOT 的安全系统,带有使用 ESP8266 的语音消息
物联网·安全·语音识别
yzzzzzzzzzzzzzzzzz6 小时前
HTML 常用标签介绍
前端·html
老虎06277 小时前
JavaWeb前端(HTML,CSS具体案例)
前端·css·html
i紸定i9 小时前
解决html-to-image在 ios 上dom里面的图片不显示出来
前端·ios·vue·html·html-to-image
ai.Neo9 小时前
(第十七期)HTML图像标签详解:从入门到精通
前端·html
阿珊和她的猫9 小时前
autofit.js: 自动调整HTML元素大小的JavaScript库
开发语言·javascript·html
Justinc.1 天前
HTML5新增属性
前端·html·html5
挽淚1 天前
HTML5语义化标签和“<div>的一招鲜吃遍天”
html