• 技术文章 >web前端 >Vue.js

    vue怎么实现文本转语音

    藏色散人藏色散人2022-11-19 17:08:30原创284

    vue实现文本转语音的方法:1、创建一个SpeechSynthesisUtterance对象;2、通过“isIe(){...}”方式实现浏览器判断;3、根据ie使用方法即可,代码如“if(this.isIe()){let voiceObj = new ActiveXObject("Sapi.SpVoice")voiceObj.Rate = ...)”。

    大前端零基础入门到就业:进入学习

    本教程操作环境:windows7系统、vue3、Dell G3电脑。

    vue怎么实现文本转语音?

    vue实现文字转语音功能详解

    目前h5新增一个文字转语音的功能(但是正在完善中,勉强能用),h5新增的SpeechSynthesisUtterance实例

    首先new一个SpeechSynthesisUtterance对象

    使用实例对象的一些属性,包括:

    方法

    但是这个方法不支持老版的ie,需要加浏览器判断方法

    isIe(){
        if(!!window.ActiveXObject || "ActiveXObject " in window){
            return true
        }else{
            return false
        }
    },

    然后根据ie使用方法

       voice(e){
        window.speechSynthesis.cancel()
          let timer
          timer = setInterval(() => {
            let msg = e
            if(this.isIe()){
                let voiceObj = new ActiveXObject("Sapi.SpVoice")
                voiceObj.Rate = -1 // 语速
                voiceObj.Volume = 50 // 音量
                voiceObj.Speak(msg,1)
            }else{
                let speakMsg = new 
                   SpeechSynthesisUtterance(msg)
                speakMsg.rate = 1 // 语速
                speakMsg.pitch = 3 // 音量
                window.speechSynthesis.speak(speakMsg)
            }
         }, 1000)
         setTimeout(() => {
            // 一段时间后清除定时器
            clearInterval(timer)
         }, 1000)
        },

    推荐学习:《vue.js视频教程

    以上就是vue怎么实现文本转语音的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。

    前端(VUE)零基础到就业课程:点击学习

    清晰的学习路线+老师随时辅导答疑

    自己动手写 PHP MVC 框架:点击学习

    快速了解MVC架构、了解框架底层运行原理

    专题推荐:Vue
    上一篇:vue中怎么实现点击切换页面 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • ❤️‍🔥共22门课程,总价3725元,会员免费学• ❤️‍🔥接口自动化测试不想写代码?• 深入理解vue2中的VNode和diff算法• vue3安装太卡怎么办• vue中怎么实现点击切换页面• vue结尾的是什么文件• vue报错找不到图片怎么办
    1/1

    PHP中文网