当前位置:   article > 正文

微信同声传译小程序插件使用教程

微信同声传译

微信同声传译小程序插件 —— 机器翻译、智能语音

案例可搜索“一起学英语鸭”小程序查看,  实现效果如下图:

插件功能

  • 语音转文字

  • 语音合成

  • 文本翻译

 

step 1:添加插件

在使用前,需要登录官网 设置 → 第三方服务 → 添加插件

搜索 【微信同声传译】并添加

在需要使用插件的小程序 app.json 中指明需要使用的插件版本等信息

  1. // app.json
  2. {
  3.  ...
  4.  "plugins": {
  5.    ...
  6.    "WechatSI": {
  7.      "version": "0.0.6",
  8.      "provider": "wx069ba97219f66d99"
  9.  }
  10. }

接下来,在index.js引入插件,获取全局唯一的语音识别管理器recordRecoManager

  1. // index.js
  2. const plugin = requirePlugin("WechatSI")
  3. const manager = plugin.getRecordRecognitionManager()

step 2:语音输入

希望做到的效果是按住某个按钮,开始识别语音,松开按钮就结束识别

 
<view  catchtouchstart="streamRecord" catchtouchend="endStreamRecord">中文view>

  1. // index.js
  2. Page({
  3.  data: {},
  4.  streamRecord: function() {
  5.    manager.start({
  6.      lang: 'zh_CN',
  7.    })
  8.  },
  9.  streamRecordEnd: function() {
  10.    manager.stop()
  11.  }
  12. })

step 3:绑定录音回调事件

 
  1. <view>语音识别内容:{{currentText}}view>

  1. // page.js
  2. Page({
  3.  data: {
  4.    currentText: '',
  5.  },
  6.  initRecord: function() {
  7.    //有新的识别内容返回,则会调用此事件
  8.    manager.onRecognize = (res) => {
  9.      let text = res.result
  10.      this.setData({
  11.        currentText: text,
  12.      })
  13.    }
  14.    // 识别结束事件
  15.    manager.onStop = (res) => {
  16.      let text = res.result
  17.      if(text == '') {
  18.        // 用户没有说话,可以做一下提示处理...
  19.        return
  20.      }
  21.      this.setData({
  22.        currentText: text,
  23.      })
  24.      // 得到完整识别内容就可以去翻译了
  25.      this.translateTextAction()
  26.    }
  27.  },
  28.  translateTextAction: function() {},
  29.  onLoad: function() {
  30.    this.initRecord()
  31.  }
  32. })

step 4:文本翻译

 
  1. <view>翻译结果:{{translateText}}view>

  1. // page.js
  2. Page({
  3.  data: {
  4.    currentText: '',
  5.    translateText: '',
  6.  },
  7.  translateTextAction: function() {
  8.    let lfrom =  'zh_CN'
  9.    let lto = 'en_US'
  10.    plugin.translate({
  11.      lfrom: lfrom,
  12.      lto: lto,
  13.      content: this.data.currentText,
  14.      tts: true, // 需要合成语音
  15.      success: (resTrans)=>{
  16.        // 翻译可以得到 翻译文本,翻译文本的合成语音,合成语音的过期时间
  17.        let text = resTrans.result
  18.        this.setData({
  19.          translateText: text,
  20.        })
  21.        // 得到合成语音让它自动播放出来
  22.        wx.playBackgroundAudio({
  23.          dataUrl: resTrans.filename,
  24.          title: '',
  25.        })
  26.      },
  27.    })
  28.  },
  29. })

step 5:语音合成

plugin.translate得到的语音文件是有过期时间,可以download到本地使用。

如果像面对面翻译一样需要存比较多历史记录的话,也可以选择过期之后调用plugin.textToSpeech接口再去重新合成一次。

  1.  plugin.textToSpeech({
  2.    lang: 'zh_CN',
  3.    content: '我想重新进行语音合成',
  4.    success: resTrans => {
  5.      // 可以重新得到语音合成文件和过期时间
  6.    },
  7. })

面对面翻译小程序

面对面翻译小程序是微信团队针对中英文面对面沟通的场景开发的流式语音翻译小程序,基于微信同声传译插件封装实现,提供了中英文语音识别,文本翻译等功能。

预览

下载与使用

  1. 克隆代码
  2. project.config.json 中的 appid 替换成在公众平台申请的项目 id
  3. 公众平台 → 设置 → 第三方服务 → 插件管理 中 添加微信同声传译插件 (wx069ba97219f66d99)
  4. 打开微信开发者工具中添加项目

微信版本要求

基础库版本 >= 1.9.94

  • 使用插件,需要基础库版本 >= 1.9.6
  • 插件内调用wx.getRecorderManager接口,需要基础库版本 >= 1.9.94

微信同声传译插件支持功能

  • 语音识别 (目前支持 zh_CN(中国大陆), en_US(英语))
  • 文本翻译 (目前支持 zh_CN(中国大陆),  en_US(英语))
  • 语音合成 (目前支持 zh_CN(中国大陆),  en_US(英语))
本文内容由网友自发贡献,转载请注明出处:【wpsshop博客】
推荐阅读
相关标签
  

闽ICP备14008679号