【语音月】AI小程序之语音听写
wangwei8638 发布于2019-11 浏览:3709 回复:7
0
收藏
最后编辑于2022-04

语音识别极速版能将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 {

  width: 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 {

    width: 10%;

    height: 20px;

    background-color: #eeeeee;

 4 实现效果

收藏
点赞
0
个赞
共7条回复 最后由用户已被禁言回复于2022-04
#20用户已被禁言回复于2022-04

http://www.minitu.cn/?s=%E8%B4%A2%E7%A5%9E%E5%9B%BD%E9%99%85%E5%8E%85%E7%8E%B0%E5%9C%BA%E7%94%B5%E6%8A%95%E5%BE%AE%E4%BF%A1%E5%BC%80%E6%88%B7B2024.cN%E5%BC%80%E5%B0%81%E4%BA%BA%E6%89%8D%E7%BD%91%EF%BC%B9 http://pro.baidu.com/new/home/search/search?keyword=%E8%80%81%E8%A1%97%E9%91%AB%E7%99%BE%E5%88%A9%E6%B3%A8%E5%86%8C%E3%80%90TL262%C2%B7C%EF%BC%AFM%E3%80%91%E4%B9%8C%E6%B5%B7%E7%83%AD%E6%90%9C%EF%BC%AC%EF%BD%9B%EF%BC%B9&type=all http://dblab.xmu.edu.cn/?s=%E4%BA%91%E5%8D%97%E6%99%AF%E6%B4%AA%E7%BD%91%E4%B8%8A%E9%BE%99%E8%99%8E%E5%AE%98%E7%BD%91TL262%C2%B7%EF%BC%A3%EF%BC%AF%EF%BC%AD%E5%94%90%E5%B1%B1%E7%99%BE%E5%A7%93%E7%BD%91%EF%BC%B3%EF%BD%81 http://pro.baidu.com/new/home/search/search?keyword=%E7%A6%8F%E5%BB%BA%E5%BB%BA%E9%98%B3%E5%93%AA%E6%9C%89%E7%BD%91%E4%B8%8A%E5%B9%B3%E5%8F%B0%E3%80%90B2024%C2%B7CN%E3%80%91%E8%BE%BD%E9%98%B3%E4%BC%81%E4%B8%9A%EF%BC%B1%EF%BD%89%EF%BD%8A&type=all https://unsplash.com/s/collections/%E6%B2%B3%E5%8D%97%E5%8D%97%E9%98%B3%E5%93%AA%E9%87%8C%E8%83%BD%E7%8E%A9%E5%BA%84%E5%92%8C%E9%97%B2%E5%BC%80%E6%88%B7TL262.c%EF%BC%AF%EF%BC%AD%E5%A4%A7%E5%90%8C%E8%AE%BF%E8%B0%88%EF%BC%96%EF%BD%84 https://www.oschina.net/search?scope=all&q=%E6%96%B0%E4%B8%96%E7%95%8C%E8%81%94%E7%B3%BB%E7%94%B5%E8%AF%9D%E5%AE%98%E6%96%B9%E7%BD%91%E5%9D%80B2024%C2%B7CN%E5%94%90%E5%B1%B1%E8%8A%82%E7%9B%AE%E8%A1%A8%EF%BD%96 https://ai.baidu.com/search/%E6%B5%B7%E5%A4%A9%E5%9B%BD%E9%99%85%E7%8E%B0%E5%9C%BA%E5%9C%A8%E4%BB%80%E4%B9%88%E5%9C%B0%E6%96%B9%E5%AE%98%E7%BD%91TL262%C2%B7C%EF%BC%AFM%E5%AE%9C%E6%98%8C%E5%A4%A7%E5%AD%A6%EF%BD%8E%EF%BC%9F/all/1

0
#7笔墨哥回复于2020-02
#6 wangwei8638回复
扫码体验 [图片]

嗯,应用的好棒呀~

0
#6wangwei8638回复于2020-02

扫码体验

0
#5wangwei8638回复于2019-11

识别速度可以,还需加入文本纠正

0
#4小雨青青润无声回复于2019-11
#3 wangwei8638回复
考虑怎么加入自动语音提醒

有自动提醒功能就会更完善

0
#3wangwei8638回复于2019-11

考虑怎么加入自动语音提醒

0
#2wangwei8638回复于2019-11

语音记事本功能

0
TOP
切换版块