语音识别(兼容性较差)
var newRecognition = new webkitSpeechRecognition();
语音合成
即文字转语音
let msg = new window.SpeechSynthesisUtterance('你好,我是康师傅');
document.body.onclick = function () {
window.speechSynthesis.speak(msg);
}
SpeechSynthesisUtterance实例属性和回调
- text – 文字内容
- lang – 语言,如:"zh-cn"
- voiceURI – 指定希望使用的声音和服务,字符串。
- volume – 音量,0~1,默认1。
- rate – 语速,0.1~10,默认1。
- pitch – 音调,0~2,默认1。
- onstart
- onpause
- onresume
- onend
speechSynthesis 方法
speak() – 传入SpeechSynthesisUtterance实例,读合成的话语。
stop() – 终止合成过程。
pause() – 暂停合成过程。
resume() – 重新开始合成过程。
getVoices – 返回浏览器支持的语音包列表
波形图插件 wfplayer
<script src="https://github.com/zhw2590582/WFPlayer/tree/master/dist/wfplayer.js"></script>
<body>
<div id="waveform" style="width: 1000px; height: 300px"></div>
<audio id="audio" src="./bg.mp3" autoplay></audio>
</body>
<script>
var wf = new WFPlayer({
container: document.querySelector('#waveform'),
backgroundColor: 'rgba(100, 100, 100,0.5)',
waveColor: 'red',
cursor: true,
progress: true,
progressColor: 'rgba(100, 100, 100, 0.5)',
grid: false,//网格
ruler: false,//时间刻度
duration: 10
});
wf.load(document.querySelector('#audio'));
</script>
网友评论