首页 > 编程知识 正文

微信在线翻译小程序,微信小程序英文变中文

时间:2023-05-04 21:08:29 阅读:269478 作者:2459

小程序登录: https://mp.weixin.qq.com/

微信小程序的插件“同声传译”可以把文字转化成语音,也可以进行中英文的翻译。下面介绍一下具体用法。

一:同声传译插件添加

依次点击 设置(左侧边栏)->第三方设置
在插件管理中选择添加插件,在弹出的添加插件对话框中输入“同声传译”进行搜索,搜索到之后进行添加。

2、添加完成后,可以在详情中看到“同声传译”的APPID和版本号

二: 同声传译Demo开发

demo效果图如下:
1、输入文本,点击播放可以合成声音
2、输入文本,点击翻译可以进行翻译。

1、首先在app.json中添加插件
version插件详情中的版本号、provider是插件中的APPID

"plugins": { "WechatSI": { "version": "0.3.3", "provider": "wx069ba97219f66d99" } }

2、页面效果

WXML代码内容

<textarea class="textarea-container" placeholder='请输入内容' value='{{content}}' bindinput='inputChange'></textarea><view class='btn-container' bindtap="playVoice"> <view>播放声音</view></view><view class='btn-container' bindtap="translateToEnglish"> <view>中译英(文字翻译)</view></view><view class='btn-container' bindtap="translateToChinese"> <view>英中译(文字翻译)</view></view><view class="cell-title">翻译结果</view><view class="cell-content">{{translateResult}}</view>

WXSS文件内容

.textarea-container{ border:1rpx solid rgba(112, 195, 160, 1); width:690rpx; margin-left:30rpx; margin-top: 30rpx; height:200rpx;}.btn-container { width: 100%; padding: 20rpx 0; background-color: white; display: flex; justify-content: center; bottom: 0; left: 0;}.btn-container view { display: flex; justify-content: center; height: 88rpx; width: 680rpx; background: rgba(112, 195, 160, 1); border-radius: 10rpx; align-items: center; color: white;}.cell-title{ color:#333; margin-top: 50rpx; font-size:35rpx; margin-left: 30rpx; font-weight: 500; border-bottom: 1px solid rgba(112, 195, 160, 1);}.cell-content{ color:#888888; margin-top: 50rpx; font-size:30rpx; margin-left: 30rpx; font-weight: 500;}

3 对应JS的实现

const app = getApp();const plugin = requirePlugin('WechatSI');Page({ data: { content: '今天是个好天气', src: '', translateResult: '此处显示翻译结果' }, onReady(e) { this.innerAudioContext = wx.createInnerAudioContext(); this.innerAudioContext.onError(function(res) { console.log(res); wx.showToast({ title: '语音播放失败', icon: 'none', }) }) }, inputChange: function(e) { this.setData({ content: e.detail.value, }) }, playVoice: function(e) { var that = this; var content = this.data.content; plugin.textToSpeech({ lang: "zh_CN", tts: true, content: content, success: function(res) { console.log(res); console.log("succ tts", res.filename); that.setData({ src: res.filename }) that.play(); }, fail: function(res) { console.log("fail tts", res) } }) }, play: function(e) { if (this.data.src == '') { console.log(暂无语音); return; } this.innerAudioContext.src = this.data.src this.innerAudioContext.play(); }, stopVoice: function(e) { this.innerAudioContext.pause(); }, translateToEnglish: function(e) { var that = this; that.translate("zh_CN", "en_US") }, translateToChinese: function(e) { var that = this; that.translate("en_US", "zh_CN") }, translate: function(lfrom, lto) { var that = this; var content = this.data.content; plugin.translate({ lfrom: lfrom, lto: lto, content: content, success: function(res) { if (res.retcode == 0) { console.log("result", res.result) that.setData({ translateResult: res.result }) } else { console.warn("翻译失败", res) that.setData({ translateResult: "翻译失败" }) } }, fail: function(res) { console.log("网络失败", res) that.setData({ translateResult: "网络失败" }) } }) }})

注意:
同声传译默认配额如下,如果想要更多配额需要提交申请。
语音输入配额:每个小程序250条/分钟,3w条/天。
文本翻译配额:每个小程序500次/分钟,10w次/天。
语音合成配额:每个小程序100次/分钟,2w次/天。

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。