如何在vue项目或网页上实现文字转换成语音播放功能
这篇文章主要为大家展示了如何在vue项目或网页上实现文字转换成语音播放功能,内容简而易懂,希望大家可以学习一下,学习完之后肯定会有收获的,下面让小编带大家一起来看看吧。
成都创新互联公司,为您提供重庆网站建设公司、成都网站制作公司、网站营销推广、网站开发设计,对服务成都葡萄架等多个行业拥有丰富的网站建设及推广经验。成都创新互联公司网站建设公司成立于2013年,提供专业网站制作报价服务,我们深知市场的竞争激烈,认真对待每位客户,为客户提供赏心悦目的作品。 与客户共同发展进步,是我们永远的责任!
一、在网页上实现文字转换成语音
方式一:
摘要:语音合成:也被称为文本转换技术(TTS),它是将计算机自己产生的、或外部输入的文字信息转变为可以听得懂的、流利的口语输出的技术。
1、 使用百度的接口:
http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=2&text=你要转换的文字
2、参数说明:
lan=zh:语言是中文,如果改为lan=en,则语言是英文。
ie=UTF-8:文字格式。
spd=2:语速,可以是1-9的数字,数字越大,语速越快。
text=**:这个就是你要转换的文字。
3、代码示例:
语音测试
方式二:
1、调动方法:参数为指定文字
2、这里主要用的是SpeechSynthesisUtterance的方法
3、代码示例:
在这里插入代码片
二、在vue项目中实现文字转换为语音播放
1、调用方法:参数为指定的文字
2、主要使用的也是是SpeechSynthesisUtterance的方法(其他方法也可以,如使用百度的接口)
3、代码示例:
在这里插入代码片
在这里插入代码片 methods: { read: function(word) { const synth = window.speechSynthesis; const msg = new SpeechSynthesisUtterance(); msg.text = word; msg.lang = "zh-CN"; function handleSpeak(e) { synth.speak(msg); } function throttle(fn, delay) { let last = 0; return function() { const now = new Date(); if (now - last > delay) { fn.apply(this, arguments); last = now; } }; } console.log(msg); throttle(handleSpeak(), 1000); }, }
点击小喇叭即可播放
以上就是关于如何在vue项目或网页上实现文字转换成语音播放功能的内容,如果你们有学习到知识或者技能,可以把它分享出去让更多的人看到。
新闻名称:如何在vue项目或网页上实现文字转换成语音播放功能
文章起源:http://scyanting.com/article/ipjoic.html