腾讯云智能语音小程序插件实现实时语音识别

 "pages/pl/pl",

// pages/pl/pl.js
const recorderManager = wx.getRecorderManager()  // 获取全局唯一的录音管理器 RecorderManager
const innerAudioContext = wx.createInnerAudioContext()  // 创建内部 audio 上下文 InnerAudioContext 对象。
let plugin = requirePlugin("QCloudAIVoice");  //引入语音识别插件
plugin.setQCloudSecret(1251123904, "AKIDa0CKPR3IE4nPs6T4oKacS3gGnFX?????", "?????7Zlxuc5JI2XnnWyA5k8HF2YooXz", true);//设置腾讯云账号信息，其中appid是数字，secret是字符串，openConsole是布尔值(true/false)，为控制台打印日志开关
let manager = plugin.getRecordRecognitionManager();  //获取全局唯一的语音识别管理器
var init  // 声明一个全局变量，let为局部变量
Page({  // 使用Page函数作为Page构造器来注册一个页面
  /**
   * 页面的初始数据
   */
  data: {
    time: 0, // 初始时间
    duration: 600000, // 录音时长为10分钟
    status: 0,  // 语音识别管理器的状态：1为开始，2为停止，
    voiceData:"" ,//语音识别阶段数据,
    resultNumber:1,//识别结果的段数
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {
    manager.onStart((res) => {
      console.log('recorder start', res.msg);
      this.setData({
        status: 1 // 录音识别开始状态为1
      })
})
manager.onStop((res) => {
      console.log('recorder stop', res.tempFilePath);
      clearInterval(init) // 取消之前的计时
      this.setData({
        status: 2 //录音识别结束后标记状态为2
      })
})
manager.onError((res) => {
      console.log('recorder error', res.errMsg); // 打印录音识别错误信息
})
  },
  /**开始录音并识别 */
  start: function() {
    var that=this
    clearInterval(init) // 取消之前的计时
    this.timeCounter()  // 开始计时
    //开始识别
    manager.start({
      duration:this.data.duration, 
      engine_model_type: '16k_zh',
      // 以下为非必填参数，可跟据业务自行修改
      // hotword_id = '08003a00000000000000000000000000',
      // filter_dirty = 0,
      // filter_modal = 0,
      // filter_punc = 0,
      // convert_num_mode = 0,
      // needvad = 1
      });
    //获取识别内容
    manager.onRecognize((res) => {
      if(res.result || res.resList){
          console.log("识别结果", res.result);
          that.setData({
                    Words: res.result,
            })
      }else if(res.errMsg){
          console.log("recognize error", res.errMsg);
      }
})
  },
  /**
   * 停止识别
   */
  stop: function() {
    manager.stop();
  },
  /**
   * 继续识别
   */
  continue: function() {
    manager.start({
      duration:30000, 
      engine_model_type: '16k_zh',
      // 以下为非必填参数，可跟据业务自行修改
      // hotword_id = '08003a00000000000000000000000000',
      // filter_dirty = 0,
      // filter_modal = 0,
      // filter_punc = 0,
      // convert_num_mode = 0,
      // needvad = 1
      });
  },  
  timeCounter: function(time) {  // 定义一个计时器函数
    var that = this
    if (time == undefined) {
   
      init = setInterval(function() { // 设定一个计时器ID。按照指定的周期（以毫秒计）来执行注册的回调函数
        var time = that.data.time + 1; // 每秒钟计时+1
        that.setData({
          time: time
        })
      }, 1000);
    } else {
      clearInterval(init) // 取消计时
      console.log("暂停计时")
    }
  },
})

<!--pages/pl/pl.wxml-->
<view class="REC">
  <view class="time">{{status==0?'录音时长':(status==3?'录音结束':'录音中')}}：{{time}} 秒 ({{duration/1000}}秒)</view>
  <view class="rin">
  </view>
  <view class="anniu">
    <view class="{{status==0?'highlight':'gray'}}" bindtap="start" hover-class="skip">录音识别</view>
    <view class="{{status==1?'highlight':'gray'}}" bindtap="stop" hover-class="skip">停止识别</view>
    <view class="{{status==2?'highlight':'gray'}}" bindtap="continue" hover-class="skip">继续识别</view>
  </view>
   <view class="progress">
    <progress percent="{{time*(100/(duration/1000))}}"  stroke-width="10" backgroundColor="#fff" border-radius="15" stroke-width="4" color="#7FFF00" active />
  </view>
</view>
<view class=".REC">
  <textarea placeholder="录音完成后点击识别可将音频转文字" auto-focus value="{{ Words }}" />
</view>

/* pages/pl/pl.wxss */
.REC {
  border-radius: 50rpx;
  background-color: rgb( 199,237,204 );
  padding: 6rpx 0rpx;
  margin: 15rpx 35rpx;
}

.rin {
  justify-content: space-between;
  align-items: center;
  margin: 0rpx 120rpx;
  display: flex;
}

.rin .show {
  background-color: rgb(178, 228, 228);
  padding: 15rpx;
  width: 210rpx;
  border: 5rpx solid rgb(127, 204, 214);
  border-radius: 20rpx;
  font-size: 28rpx;
  display: flex;
  justify-content: center;
  align-items: center;
}

.rin .hide {
  padding: 15rpx;
  align-items: center;
  border-radius: 20rpx;
  display: flex;
  width: 215rpx;
  font-size: 28rpx;
  justify-content: center;
  border: 5rpx solid #eee;
  pointer-events: none;
  background-color: rgba(137, 190, 178, 0.445);
}

.time {
  text-align: center;
  line-height: 75rpx;
  font-size: 28rpx; 
}

.progress {
  margin: 25rpx;
}

.play {
  margin: 0rpx 25rpx;
}

.content {
  line-height: 60rpx;
  font-size: 28rpx;
  display: flex;
  justify-content: center;
}

.anniu {
  display: flex;
  margin: 10rpx 50rpx;
  justify-content: space-between;
}

.highlight {
  display: flex;
  font-size: 18rpx;
  width: 80rpx;
  height: 80rpx;
  justify-content: center;
  border-radius: 50%;
  align-items: center;
  background-color: rgb(107, 194, 53);
  border: 5rpx solid rgb(127, 204, 214);
}

.skip {
  transform: scale(0.9);
}



.anniu .gray {
  pointer-events: none;
  background-color: rgba(137, 190, 178, 0.445);
  display: flex;
  width: 80rpx;
  height: 80rpx;
  font-size: 18rpx;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  border: 5rpx solid rgb(241, 244, 245); 
}

{
  "navigationBarTitleText": "实时语音识别在线测试",
  "backgroundColor": "#eeeeee"
}