zoukankan      html  css  js  c++  java
  • AI小程序之语音听写来了,十分钟掌握百度大脑语音听写全攻略!!

    语音识别极速版能将60秒以内的完整音频文件识别为文字。用于近场短语音交互,如手机语音搜索、聊天输入等场景。 支持上传完整的录音文件,录音文件时长不超过60秒。实时返回识别结果。本文主要介绍采用百度语音识别,实现小程序的听写功能。

    想了解微信小程序的开发过程,请参看我之前的帖子:《UNIT接入小程序》https://ai.baidu.com/forum/topic/show/953022

    想了解语音识别极速版的调用过程,请参看我之前的帖子:《语音问答机器人小程序》

    https://ai.baidu.com/forum/topic/show/953177

    1 系统框架

    用到的技术主要有:百度语音识别和微信小程序。采用微信提供的录音管理器 recorderManager实现录音,录音格式aac。小程序将用户上传的语音提交给百度语音证识别服务,返回文本信息并显示出来。全部功能都在小程序客户端完成,不需要服务器,适合个人开发者学习调试使用,同时也为商业应用提供相应解决方案。

    2创建小程序项目

    在根目录的全局配置文件app.json中增加:"pages/asr/asr" ,会自动创建相关页面文件,结构如下:

    asr.js:功能逻辑模块

    asr.wxss:页面样式文件

    asr.wxml:页面布局文件

    asr.json:页面配置文件

    3 调用语音识别极速版API

    3.1 首先要在控制台创建应用,调用语音识别极速版API,“获取API Key/Secret Key”。

    接口文档地址:https://ai.baidu.com/docs#/ASR-API-PRO/top

    请求URL: https://vop.baidu.com/pro_api

    Body中放置请求参数,参数详情如下:

    返回参数:

    3.2 语音识别极速版功能实现

    (1)发送URL请求核心代码

    //在baiduai.js中发送URL请求,并进行封装。
    
    let asrRequest = (tempFilePath, len, arg) =>{ // corpus是要发送的对话;arg是回调方法
    
      var that = this;
    
      var voice = fs.readFileSync(tempFilePath, "base64");
    
      var asr_token = app.globalData.access_token;
    
      console.log("[Console log]:asr_token" + asr_token);
    
      var rqJson = {
    
        'dev_pid': 80001,
    
        'format': 'm4a',
    
        'rate': 16000,
    
        'token': asr_token,
    
        'cuid': 'qwertyuguilgfds678iutfydthrgfe',
    
        'channel': 1,
    
        'len': len,
    
        'speech': voice
    
      };
    
      var rq = JSON.stringify(rqJson);
    
      console.log(rq);
    
      var ASRUrl = app.globalData.ASRUrl;
    
      // cusid是用来实现上下文的,可以自己随意定义内容,要够长够随机
    
      var cusid = app.globalData.NLPCusid;
    
      //console.log("[Console log]:ASRRequest(),URL:" + ASRUrl);
    
      wx.request({
    
        url: ASRUrl,
    
        data: rq,
    
        header: { 'content-type': 'application/json' },
    
        method: 'POST',
    
        success: function (res) {
    
          var resData = res.data;
    
          //  var text = resData.result;
    
          console.log("[Console log]:resData" + resData);
    
        
    
          var nli = JSON.stringify(resData);
    
          console.log("[Console log]:Result:" + nli);
    
          // 回调函数,解析数据
    
          typeof arg.success == "function" && arg.success(nli);
    
        },
    
        fail: function (res) {
    
          // console.log("[Console log]:ASRRequest() failed...");
    
          // console.error("[Console log]:Error Message:" + res.errMsg);
    
          typeof arg.fail == "function" && arg.fail();
    
        },
    
        complete: function () {
    
          //  console.log("[Console log]:ASRRequest() complete...");
    
          typeof arg.complete == "function" && arg.complete();
    
        }
    
      })
    
    }
    
    //接口
    
    module.exports = {
    
    asrRequest:asrRequest,
    
     }

    (2)定义按钮点击事件

    //在asr.js中定义按钮点击事件
    
    
      sendAsrRequest(tempFilePath, fileSize) {
    
        var that = this;
    
        api.asrRequest(tempFilePath, fileSize, {
    
          'success': function (res) {
    
            var resData = JSON.parse(res);
    
            // console.log(res.result);
    
            // var resData = res.data;
    
            //提取json数据的'result'
    
            var asr_out = resData.result;
    
            that.setData({asr_output: asr_out});
    
            console.log("有返回语音:"+asr_out);
    
            if (res.status == "error") {
    
              wx.showToast({
    
                title: '返回asr数据有误!',
    
              })
    
              return;
    
            }
    
          },
    
          'fail': function (res) {
    
            wx.showToast({
    
              title: '请求asr失败!',
    
            })
    
            return;
    
          }
    
        });
    
      },

    (3)定义按钮点击事件

    //在asr.js中定义定义按钮点击事件
    
    // 按钮按下
    
      touchdown: function () {
    
        var that = this;
    
        // 开始录音
    
        recorderManager.start(voiceOptions);
    
        this.setData({
    
          isSpeaking: true,
    
        })
    
        that.speaking.call();
    
        // console.log("[Console log]:Touch down!Start recording!");
    
      },
    
      // 停止录音,会触发onStop事件
    
      touchup: function () {
    
        var that = this;
    
        recorderManager.stop(voiceOptions)
    
        // console.log("[Console log]:Touch up!Stop recording!");
    
        this.setData({
    
          isSpeaking: false,
    
          speakerUrl: '/res/image/speaker.png',
    
        })
    
        clearInterval(that.speakerInterval);//定时器停止
    
      },
    
    
    
    
        // 添加录音停止触发事件,这段代码可以放到onLoad()里,页面加载的时候就添加上
    
        recorderManager.onStop((res) => {
    
          const { tempFilePath, fileSize } = res
    
          //  console.log("ok!!res:", res);
    
          this.sendAsrRequest(res.tempFilePath, res.fileSize);
    
          //  console.log("ok!! res.fileSize:", res.fileSize);
    
          //  console.log("ok!! res.tempFilePath:", res.tempFilePath);
    
        });
    
        recorderManager.onError((res) => {
    
          //  console.log("error", res);
    
        });
    
    

     (4)修改页面样式文件

    /* pages/asr/asr.wxss */
    
    .atbottom {
    
       100%;
    
      height: 50px;
    
      display: flex;
    
      flex-direction: row;
    
      justify-content: center;
    
      position: fixed;
    
      background: #3366FF;
    
      bottom: 0;
    
    }
    
    
    .result{
    
      font-size: 32rpx;
    
      color: #fa4627;
    
      border-top: 1rpx solid #eeeeee;
    
      margin:30rpx 20rpx 0rpx 20rpx;
    
      padding: 10rpx;
    
    }
    
    
    .card {
    
        border: 2px solid #807474e5;
    
        border-radius: 5px;
    
        height: 450px;
    
        background-color: #f7f33b94;
    
        box-shadow: 4px 1px 1px #cccccc;
    
        margin: 8px;
    
        position: relative;
    
    }
    
    
    .image {
    
         10%;
    
        height: 20px;
    
        background-color: #eeeeee;

     4 实现效果

    作者:wangwei8638

  • 相关阅读:
    七、阿里巴巴中文站商品信息如何存放
    四、为什么要使用NOSQL NOT ONLY SQL
    二、数据库架构发展历程
    十三、负载均衡
    三、MySQL的扩展性瓶颈
    一、秒杀架构设计
    数据库概述
    五、传统RDBMS VS NOSQL
    PHP框架开发:三、MVC设计模式及本框架的实现方式
    PHP Iterator的使用
  • 原文地址:https://www.cnblogs.com/AIBOOM/p/12485877.html
Copyright © 2011-2022 走看看