会飞的鱼

2021
分享我的互联网新知
首页 » 未分类 » 微信小程序 自动播放文本内容实例

微信小程序 自动播放文本内容实例

需求:打开文章时,让微信自动播放文本内容的语音。
实战:
1.配置微信语言播放插件
登录微信小程序 到 设置 --- 第三方设置 --添加插件
QQ截图20200305125447.jpg
搜索:微信同声传译   点击添加
查看插件详情
QQ截图20200305125559.jpg
取到 appid 和版本号
QQ截图20200305125655.jpg
2.app.json加入
"plugins": {
    "WechatSI": {
      "version": "0.3.3",
      "provider": "wx069ba97219f66d99"
    }
  },

3.具体程序页面的js加入
var app = getApp()下面加入
const plugin = requirePlugin('WechatSI');

onReady: function () {
    this.innerAudioContext = wx.createInnerAudioContext();
    this.innerAudioContext.onError(function (res) {
      console.log(res);
      wx.showToast({
        title: '语音播放失败',
        icon: 'none',
      })
    })
  },

onLoad: function (options) {函数里面加入
//语音播放
            console.log("t:" + res.data.message.message.content);
            var content = res.data.message.message.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(); //播放音频
  },
备注
res.data.message.message.content为你的文章内容,可以通过api获取哦

文章如无特别注明均为原创! 作者: crx349, 转载或复制请以 超链接形式 并注明出处 crx349博客-智能互联分享博客
原文地址《 微信小程序 自动播放文本内容实例》发布于2020-3-5

分享到:
打赏

评论

游客

看不清楚?点图切换
切换注册

登录

您也可以使用第三方帐号快捷登录

切换登录

注册