【uniapp开发小程序】实现同声传译(长按语音转文字)-编程知识

【uniapp开发小程序】实现同声传译(长按语音转文字)

效果图：

插件：

采用小程序插件：微信同声传译。插件文档定位

具体步骤：

先登录小程序后台（项目别错了）：官网传送
然后设置 => 第三方设置 => 添加插件

在插件文档里面拿到Appid和版本号

在manifest.json切换成源码视图然后在appid同级目录添加插件

然后就是引用插件，开始使用了

完整代码：

<template><view><view class="voicepad">{{voiceState}}</view><button class="cu-btn  bg-green voicebtn " @touchstart="touchStart" @touchend="touchEnd"><image src="../../static/logo.png" mode="widthFix" style="width: 50rpx;"></image></button><view class="center" style="background-color: #555555; color: #FFF;" v-show="isShow">正在录音...</view></view>
</template><script>var plugin = requirePlugin("WechatSI")let manager = plugin.getRecordRecognitionManager();export default {data() {return {voiceState: "你可以这样说...",isShow: false}},onShow() {},onLoad() {this.initRecord();},methods: {touchStart() {this.isShow = truemanager.start({//指定录音的时长，单位ms，最大为60000duration: 60000,//识别的语言，目前支持zh_CN en_US zh_HKlang: "zh_CN"});},touchEnd() {uni.showToast({title: '录音完成',icon: "none"})this.isShow = falsemanager.stop();},/**  * 初始化语音识别回调  * 绑定语音播放开始事件  */initRecord() {manager.onStart = (res) => {console.log('start', res.msg);this.voiceState = res.msg;};//有新的识别内容返回，则会调用此事件  manager.onRecognize = (res) => {this.voiceState = res.result;console.log('onRecognize');}// 识别结束事件  manager.onStop = (res) => {this.voiceState = res.result;console.log('onStop', res.result);}// 识别错误事件  manager.onError = (res) => {this.voiceState = res.msg;console.log('onError');}},}}
</script><style>.voicebtn {height: 130upx;display: block;width: 130upx;line-height: 130upx;border-radius: 65upx;font-size: 50upx;position: absolute;top: 1060upx;left: 310upx;}.voicepad {height: 250upx;width: 680upx;background: #fff;margin: 30upx auto;border-radius: 8upx;padding: 20upx;font-size: 35upx;}.center {text-align: center;align-items: center;width: 200rpx;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);padding: 20rpx;border-radius: 20rpx;/* 	height: 50rpx; */opacity: 0.8;}
</style>