最近在用soket实现终端控制器的功能,然后就想用语音控制,这样显得更AI

WechatSImanifest.json中配置:

在vue中插入如下展示代码:

<view class="voice-content">语音识别内容:<text class="text holy-font">{{currentText}}</text></view>

  

如果需要按住按钮说话,松开回调:

<button class="echo-btn cuIcon-voice" :class="isSpeaking?'orange':'green'" @touchstart="streamRecord" @touchend="streamRecordEnd"></button>

  

接下来就是js使用方法:

              streamRecord: function() {
voicManager.start({
lang: 'zh_CN',
})
uni.vibrateShort();
this.isSpeaking = true;
},
streamRecordEnd: function() {
voicManager.stop();
uni.vibrateShort();
this.isSpeaking = false;
},
initRecord: function() { //有新的识别内容返回,则会调用此事件
// voicManager.onRecognize = (res) => {
// let text = res.result
// this.currentText=text;
// }
// 识别结束事件
voicManager.onStop = (res) => {
console.log(res)
let text = res.result
if (text == '') { // 用户没有说话,可以做一下提示处理...
return
}
this.currentText = text;
// 这里得到完整识别内容就可以去翻译了
this.translateTextAction();
}
}
// translateTextAction: function() {
// let lfrom = 'zh_CN';
// let lto = 'en_US';
// voicPlugin.translate({
// lfrom: lfrom,
// lto: lto,
// content: this.data.currentText,
// tts: true, // 需要合成语音
// success: (resTrans) => { // 翻译可以得到 翻译文本,翻译文本的合成语音,合成语音的过期时间
// let text = resTrans.result;
// this.translateText=text;
// // this.setData({
// // translateText: text,
// // }); // 得到合成语音让它自动播放出来
// // wx.playBackgroundAudio({
// // dataUrl: resTrans.filename,
// // title: '',
// // });
// }
// })
// },

  

实现的效果如下:

另:结合利用soket通信推送消息,可实现语音控制大屏展示项目

uniapp结合小程序第三方插件“WechatSI”实现语音识别功能,进而实现终端控制的更多相关文章

  1. uniapp开发小程序

    uniapp开发小程序 uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS.Android.Web(响应式).以及各种小程序(微信/支付宝/百度/头条 ...

  2. 「速成应用」实在可靠的 微信小程序第三方代理加盟平台公司

    小程序,是基于微信平台的一个划时代产品,也就是嵌入到微信里的一个功能丰富.操作简洁的轻应用,不需要下载安装即可使用.不同的小程序,能实现不同的功能.例如,买电影票.餐厅排号.餐馆点菜.查询公交.查询股 ...

  3. 小程序第三方框架对比 ( wepy / mpvue / taro )(转)

    文章转自  https://www.cnblogs.com/Smiled/p/9806781.html 众所周知如今市面上端的形态多种多样,手机Web.ReactNative.微信小程序, 支付宝小程 ...

  4. 小程序第三方框架对比 ( wepy / mpvue / taro )

      众所周知如今市面上端的形态多种多样,手机Web.ReactNative.微信小程序, 支付宝小程序, 快应用等,每一端都是巨大的流量入口,当业务要求同时在不同的端都要求有所表现的时候,针对不同的端 ...

  5. 微信小程序图表插件 - wx-charts

    微信小程序图表插件(wx-charts)基于canvas绘制,体积小巧支持图表类型饼图.线图.柱状图 .区域图等图表图形绘制,目前wx-charts是微信小程序图表插件中比较强大好使的一个. wx-c ...

  6. uni-app解决小程序圆角样式不生效

    在使用uni-app实现小程序的时候,设置左图的右圆角不生效,样式也都没有问题,在模拟器上也可以正常现实,手机上样式出现差别,现有以下解决方法: 设置整个圆角,然后左边使用margin-left:-3 ...

  7. 微信小程序0.11.122100版本新功能解析

    微信小程序0.11.122100版本新功能解析   新版本就不再吐槽了,整的自己跟个愤青似的.人老了,喷不动了,把机会留给年轻人吧.下午随着新版本开放,微信居然破天荒的开放了开发者论坛.我很是担心官方 ...

  8. 微信小程序调用用百度地图天气功能

    #小程序之调用百度地图天气功能 本篇博客主要介绍小程序在百度地图中获取天气信息,如有不全请指出.下面先上效果图 主要内容 百度地图API的个人密钥,也就是AK 请求百度地图API接口数据 获取到的信息 ...

  9. uni-app微信小程序开发之引入腾讯视频小程序播放插件

    登录微信小程序管理后台添加腾讯视频播放插件: 正式开始使用腾讯视频小程序插件之前需先在微信公众平台 -> 第三方设置 -> 插件管理处添加插件,如下图所示: 在uni-app中引入插件代码 ...

随机推荐

  1. sourcetree安装以及跳过sourcetree注册登录 - git仓库管理工具桌面版

      腾讯软件下载:https://pc.qq.com/detail/17/detail_23237.html 官网下载:https://www.sourcetreeapp.com/   下载完直接安装 ...

  2. 利用kindlegen实现txt格式小说转换为mobi格式小说(C++实现)

    一直以来喜欢在kindle上看小说,kindle不伤眼,也可以帮助控制玩手机的时间.但在kindle上看txt格式的网络小说就很头疼了,这类小说在kindle上是没有目录的,而且篇幅巨长.所以一直以来 ...

  3. MVC学生管理系统-阶段II(添加学生信息)

    项目源码 :https://download.csdn.net/download/weixin_44718300/11091042 前期准备,主体框架,学生列表显示    请看上一篇文章 本文是对阶段 ...

  4. HZNU-ACM寒假集训Day9小结 倍增

    LCA 倍增法求最近公共祖先 首先对于每个结点先进行dfs预处理它的深度,再记录下它们往父亲方向走2的0次,1次...k次步所到达的结点.在这里2的k次大于整棵树的最大深度. 预处理完后,需要查询两个 ...

  5. 吴裕雄--天生自然JAVA SPRING框架开发学习笔记:第一个Spring程序

    1. 创建项目 在 MyEclipse 中创建 Web 项目 springDemo01,将 Spring 框架所需的 JAR 包复制到项目的 lib 目录中,并将添加到类路径下,添加后的项目如图 2. ...

  6. 吴裕雄--天生自然 PHP开发学习:数据类型

    <?php $x = "Hello world!"; echo $x; echo "<br>"; $x = 'Hello world!'; e ...

  7. day27(027-反射&JDK新特性)

    ###27.01_反射(类的加载概述和加载时机) A:类的加载概述 *加载   就是指将class文件读入内存,并为之创建一个Class对象.任何类被使用时系统都会建立一个Class对象. *连接  ...

  8. 深入理解 Java —— GC 机制

    1. 基础知识 1.1 什么是垃圾回收? 程序的运行必然需要申请内存资源,无效的对象资源如果不及时处理就会一直占有内存资源,最终将导致内存溢出,所以对内存资源的管理非常重要. 垃圾回收就是对这些无效资 ...

  9. == 与 equals区别(HashCode方法)

    1:==分析 1.2:基本类型比较 判断基本类型的数值是不是相等 1.3:对象类型比较 判断两个引用是不是指向同一个对象,即内存地址是不是相等. 2:equals分析 来判断对象内容是不是相等,一般有 ...

  10. nginx worker进程循环

    worker进程启动后,其首先会初始化自身运行所需要的环境,然后会进入一个循环,在该循环中不断检查是否有需要执行的事件,然后处理事件.在这个过程中,worker进程也是需要与master进程交互的,更 ...