要在前端实现语音合成,即将文字讲述出来,一开始考虑用百度语音合成的方法,后来发现html5 本身就支持语音合成。就直接用html5的咯,百度的那个还有调用次数限制,配置还麻烦
HTML5中相关的API实际上有两类,一类是 语音识别Speech Recognition,另外一个就是 语音合成Speech Synthesis,指的是“语音转文字”,和“文字变语音”。

一、语音转文字

var newRecognition = webkitSpeechRecognition();
newRecognition.continuous = true;

newRecognition.start();// 控制语音识别的开始

newRecognition.stop();// 停止

newRecognition.onresult = function(event) { 
    console.log(event);//识别结果
}

二、文字转语音

仅需2句,或者也可以合成一句

var utterThis = new window.SpeechSynthesisUtterance('张三,扫码成功!');
window.speechSynthesis.speak(utterThis); //这样就会有个美女姐姐语音朗读 张三,扫码成功!

在这里插入图片描述
SpeechSynthesisUtterance和speechSynthesis,是语音合成Speech Synthesis API的核心;SpeechSynthesisUtterance对象,主要用来构建语音合成实例,例如上面的实例对象utterThis。我们可以直接在构建的时候就把要读的文字内容写进去就好了

兼容性

语音识别:

在这里插入图片描述
语音合成/播报的兼容性好多了
在这里插入图片描述win10的系统基本都是可以的(别问我怎么知道的)
如果没有声音,就是没有安装或配置TTS引擎。TTS下载

Logo

CSDN联合极客时间,共同打造面向开发者的精品内容学习社区,助力成长!

更多推荐