文章正文

VUE语音播报--消息提醒

【文章】2020-04-23

简介VUE语音播报--消息提醒

就1个动态需求，所以没使用长连接获取动态数据，而是用的死循环请求
语音播报用的tts，简单实现

TTS参数说明：
lan=zh：语言是中文，如果改为lan=en，则语言是英文。
ie=UTF-8：文字格式。
spd=2：语速，可以是1-9的数字，数字越大，语速越快。
text=**：这个就是你要转换的文字。

 data(){
    return {    
      num: 0,
      new_num: 0
    };
 },
 methods: {
     xunhuan() {
          const that = this;
          this.http.get("order_tx").then(res => {
            if (res.data > that.num) {
              that.new_num = res.data - that.num;
              that.tixin();
            }
            this.num = res.data;
          });
          setTimeout(res => {
            that.xunhuan();
          }, 20000);      //1w等于10秒
     },
     tixin() {
      const that = this;            
      this.speckText('有新的订单')
      this.$notify({
        title: "订单提醒",
        message: "有" + that.new_num + "条新订单，请注意查看！",
        duration: 0,
        type: "success"
      });
    },
    //语音播报
    speckText(str) {
      var url= "http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=6&text=" + encodeURI(str);   
      new Audio(url).play();
            //var n = new Audio(url);
            //n.src = url;
            //n.play(); 
   }
  },
 mounted() { 
    this.http.get("/order_tx").then(res => {
        that.num = res.data;
    });
    this.xunhuan();
 }

打赏支持

感谢您的支持，加油!

打开微信扫码打赏，你说多少就多少

找书费时，联系客服快速获取!

扫码支持

在线客服8:30-22:30，若离线请留言！

获取教程，请联系在线客服!

扫码支持

在线客服8:30-22:30，若离线请留言！

热门阅读

找PDF电子书，太费时间?

  • 微信扫描二维码，让客服快速查找。

    • 在线客服8:30-22:00，若离线请留言！