微信小程序实现文字语音播放

本文主要是介绍微信小程序实现文字语音播放，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

1：登录微信服务平台

https://fuwu.weixin.qq.com/search?tab=3&type=&serviceType=3&page=1#search-page

2：找到了微信同声传译，登录后选择给哪个小程序添加，添加成功后去小程序的微信公众平台看已经添加成功了，而且是已通过状态。

https://blog.csdn.net/Yang_XiaoYang/article/details/119776605

3：、在微信公众平台登录小程序，添加获取APPID（不可以用测试号，否则功能实现不了），

将获取到的APPID填写至微信小程序开发工具中

 4：app.json中进行注册微信同声翻译

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

5：js中进行引用

//获取应用实例
const app = getApp()
//引入插件：微信同声传译
const plugin = requirePlugin('WechatSI')

 data 中写内容

        // 语音识别的内容
        content: '我是王越666',//内容

 生命周期函数中

        //创建内部 audio 上下文 InnerAudioContext 对象。
        this.innerAudioContext = wx.createInnerAudioContext();

 函数外定义方法

 // 文字转语音
    wordYun: 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.yuyinPlay();

            },
            fail: function (res) {
                console.log("fail tts", res)
            }
        })
    },

    //播放语音
    yuyinPlay: function (e) {
        if (this.data.src == '') {
            console.log(暂无语音);
            return;
        }
        this.innerAudioContext.src = this.data.src //设置音频地址
        this.innerAudioContext.play(); //播放音频
    },

html中：

<view>
   <button class="showCharacter" bindtap="wordYun">跟我读</button>
</view>

 效果图：这里可以换成图标

这篇关于微信小程序实现文字语音播放的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！