html+js录音功能,根据话筒音量判断是否录音

录音功能各个版本

https://github.com/xiangyuecn/Recorder

以下是H5端

在打开录音的时候添加判断录音音量


var voiceMinCount = 0;
var voiceMaxCount = 0;

var recOpen=function(){//一般在显示出录音按钮或相关的录音界面时进行此方法调用,后面用户点击开始录音时就能畅通无阻了
    rec=null;
    wave=null;
    recBlob=null;
    var newRec=Recorder({
        type:"mp3",sampleRate:16000,bitRate:16 //mp3格式,指定采样率hz、比特率kbps,其他参数使用默认配置;注意:是数字的参数必须提供数字,不要用字符串;需要使用的type类型,需提前把格式支持文件加载进来,比如使用wav格式需要提前加载wav.js编码引擎
        ,onProcess:function(buffers,powerLevel,bufferDuration,bufferSampleRate,newBufferIdx,asyncEnd){
            
            //可视化图形绘制
            //当说话音量小于一定值时,开始voiceMinCount计数
            if(powerLevel <= 10){voiceMinCount = voiceMinCount+1;}
            //当检测到说话音量大于某个值时,开始voiceMaxCount计数
            if(powerLevel >= 10){
                voiceMaxCount = voiceMaxCount+1;
            }
            //当检测到说话音量大于某个值时,voiceMinCount清零
            if(powerLevel >= 10){voiceMinCount = 0;}
            //当voiceMinCount计数达到一定值
            if((voiceMinCount >= 20)&&(voiceMaxCount > 0))
            {
                console.log("@检测到用户停止说话了voiceMinCount:"+voiceMinCount);
                voiceMinCount = 0;
                voiceMaxCount = 0;
                recStop();

                setTimeout(function() {
                    recStart();
                }, 500);
            }
        }
    });
    createDelayDialog(); //我们可以选择性的弹一个对话框:为了防止移动端浏览器存在第三种情况:用户忽略,并且(或者国产系统UC系)浏览器没有任何回调,此处demo省略了弹窗的代码
    newRec.open(function(){//打开麦克风授权获得相关资源
        dialogCancel(); //如果开启了弹框,此处需要取消
        rec=newRec;
        noActionChat()
        //此处创建这些音频可视化图形绘制浏览器支持妥妥的
        wave=Recorder.FrequencyHistogramView({elem:".recwave"});
        //recStart()
        reclog("已打开录音,可以点击录制开始录音了",2);
    },function(msg,isUserNotAllow){//用户拒绝未授权或不支持
        dialogCancel(); //如果开启了弹框,此处需要取消
        reclog((isUserNotAllow?"UserNotAllow,":"")+"打开录音失败:"+msg,2);
    });
    
    window.waitDialogClick=function(){
        dialogCancel();
        reclog("打开失败:权限请求被忽略,<span style='color:#f00'>用户主动点击的弹窗</span>",2);
    };
};

function noActionChat()
{
    //打开了录音后才能进行start、stop调用
    if(rec&&Recorder.IsOpen()){
        recBlob=null;
        rec.start();
        reclog("已开始录音...",2);
    }else{
        reclog("未打开录音",2);
    };
};

 

posted @ 2024-03-28 10:10  江郎才尽吕小布  阅读(75)  评论(0编辑  收藏  举报