浏览器语音播报

第一种方式，使用‘speechSynthesis’，可设置播放语音内容

参考文档：SpeechSynthesis - Web API 接口参考 | MDN

  
  
  



  
Text-to-Speech Example

  
  朗读

  

第二中方式，使用‘audio’，需要准备播放音频

参考文档

		333333
			

// 音乐   这里是vue3写法
const audioRed = ref()
const opens = () => {
	audioRed.value.play()
}

二者差异：

和 speechSynthesis 是两个不同的 HTML5 API，用于处理音频和语音合成，它们在功能和用途上有很大的区别。

1. 元素：

   • 是一个HTML元素，用于在网页上播放音频文件。它可以用来嵌入音乐、音效、语音记录等音频内容。
   • 元素通常需要一个音频文件的URL，然后可以通过JavaScript或者HTML属性来控制播放、暂停、调整音量、跳转到特定的时间点等操作。
   • 这个API主要用于播放现有的音频文件，不进行语音合成或语音识别。

2. speechSynthesis API：

   • speechSynthesis 是Web浏览器提供的JavaScript API，用于进行文本到语音的合成，即将文本转换为可听的语音。
   • 使用speechSynthesis，您可以在网页上动态生成语音内容，使您的应用程序能够朗读文本，例如屏幕阅读器、语音助手等。
   • 您可以通过JavaScript来创建一个SpeechSynthesisUtterance对象，设置要合成的文本、语音速度、语音音调等参数，然后将其传递给speechSynthesis来进行语音合成。
   • 这个API主要用于生成和播放文本到语音的合成语音，而不是播放预先录制的音频文件。

总之， 用于播放现有的音频文件，而 speechSynthesis 用于将文本合成为语音。它们在处理音频和语音方面具有不同的用途和功能。