admin管理员组

文章数量:1122847

功能问题概述

项目中用到了谷歌内核浏览器的文字转语音功能，需要把要朗读的文字展示出来，因此出现了语音还未读完文字已经展示结束的问题（开始使用的setTimeout函数倒计时展示文字，这种方式并不好用，倒计时结束文字收起展示，但是语音还在朗读。）

 问题修改

实现文字转语音需要用到 window.speechSynthesis 与 new SpeechSynthesisUtterance()这两个对象。

其中SpeechSynthesisUtterance提供了监听文字转语音开始于结束的函数，通过控制这两个函数来控制文字展示的时间。

//简单实现
handleSpeak(e) {
    const msg = new SpeechSynthesisUtterance();
    const synth = window.speechSynthesis

    msg.text = e //要读的文字
    msg.lang = 'zh-CN' //读汉语
    msg.volume = 1 //音量
    msg.rate = 0.9 //语速
    msg.pitch = 0.8 //音色

    msg.addEventListener('start', () => {
        console.log("开始！！！！！！")
    });

    synth.speak(msg) //开始读

    msg.addEventListener('end', this.handleEndEvent());
},
handleEndEvent() {
    console.log("结束

本文标签： 文字内核语音浏览器音频

版权声明：本文标题：JS 文字转语音 谷歌内核浏览器,实现音频与文字展示时间同步 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/biancheng/1729175555a1462095.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。