使用场景

现在大多数情景都需要自动语音播报，例如加气站进车、患者转院、新到工单等，都是要在不和页面进行交互的前提下就可以自动播放,本文章用到两个API . 使用web语音Api的 SpeechSynthesisUtterance接口来实现语音播报特定内容。SpeechSynthesis 来实现语音的播报。

使用方法

创建一个api实例，针对自己的需求进行语音内容的设置。

API接口说明：SpeechSynthesisUtterance表示语音请求。它包含语音服务应阅读的内容以及有关如何阅读它的信息（例如语言、音高和音量）。

构造函数：SpeechSynthesisUtterance()返回一个新的对象实例

const speech =new SpeechSynthesisUtterance();
speech.lang = 'zh-CN';
speech.text = payload.msg;
speech.pitch = 2;  //音调
speech.rate = 0.6; // 语速
speech.volume = 1;  //音量

实例的属性：

lang属性获取并设置语句的语言

一般值设为：zh-CN
pitch属性获取并设置将要朗读语句的音高

默认值为1。表示音高值的浮点数。

它可以介于 0（最低）和 2（最高）之间，值越大越尖锐,越低越低沉
rate属性获取并设置语句的朗读速度

默认值为 1

表示速率值的浮点数。它可以介于 0.1（最低）和 10（最高）之间
text属性获取并设置在说出话语时将合成的文本。
voice 获取并设置说话的声音

针对不同的浏览器，设置的值也会有所差异
volume 属性获取并设置将要朗读语句的音量。

默认值为 1

一个浮点数，表示介于 0（最低）和 1（最高）之间的音量值

调用接口方法实现语音播放。

window.speechSynthesis.speak(speech)

API接口说明：peechSynthesis 是语音服务的控制器接口;这可用于检索有关设备上可用的合成语音、开始和暂停语音以及其他命令的信息。

构造函数：SpeechSynthesis() 返回一个新的对象实例

实例的方法:

speak（） 方法将话语添加到话语队列中;当任何其他话语在说出之前排队时，将朗读它

整体代码示例：

    videoActions(){
      const speech =new SpeechSynthesisUtterance();
      speech.lang = 'zh-CN';
      speech.text = '嗨，我是自动播报语音小月'; 
      speech.pitch = 2;  //音调
      speech.rate = 0.6; // 语速
      speech.volume = 1;  //音量
      window.speechSynthesis.speak(speech) 
    }

注：本需求只用到个别属性及方法，如需扩展可去查对应接口。

JS 文字转语音-自动播报

使用场景

使用方法