SpeechSynthesisUtterance

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2018.

* Some parts of this feature may have varying levels of support.

Экспериментальная возможность: Это экспериментальная технология
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

The SpeechSynthesisUtterance interface of the Web Speech API represents a speech request. It contains the content the speech service should read and information about how to read it (e.g. language, pitch and volume.)

Конструктор

SpeechSynthesisUtterance.SpeechSynthesisUtterance(): Возвращает новый экземпляр объекта SpeechSynthesisUtterance

Свойства

SpeechSynthesisUtterance ещё наследует свойства из его своего родительского интерфейса EventTarget.

SpeechSynthesisUtterance.lang: Получает и устанавливает язык высказывания.
SpeechSynthesisUtterance.pitch: Получает и устанавливает высоту, на которой произносится высказывание
SpeechSynthesisUtterance.rate: Получает и устанавливает скорость, с которой будет произноситься высказывание.
SpeechSynthesisUtterance.text: Получает и устанавливает текст, который будет синтезироваться при произнесении высказывания.
SpeechSynthesisUtterance.voice: Получает и устанавливает голос, который будет использоваться для произнесения речи.
SpeechSynthesisUtterance.volume: Получает и устанавливает громкость, на котором будет произноситься высказывание.

Обработчики событий

SpeechSynthesisUtterance.onboundary: Срабатывает, когда произнесённое высказывание достигает границы слова или предложения.
SpeechSynthesisUtterance.onend: Срабатывает, когда произнесение произнесено.
SpeechSynthesisUtterance.onerror: Срабатывает, когда возникает ошибка, которая препятствует успешному произнесению высказывания.
SpeechSynthesisUtterance.onmark: Срабатывает, когда произнесённое высказывание достигает названного тега метки «SSML».
SpeechSynthesisUtterance.onpause: Срабатывает, когда высказывание приостановлено.
SpeechSynthesisUtterance.onresume: Срабатывает, когда приостановленное высказывание возобновляется.
SpeechSynthesisUtterance.onstart: Срабатывает, когда произнесение произнесено.

Examples

В нашей базовой Демо-версия синтезатора речи, мы сначала получаем ссылку на контроллер SpeechSynthesis, используя window.speechSynthesis. После определения некоторых необходимых переменных мы получаем список доступных голосов, используя SpeechSynthesis.getVoices(), и заполнить меню выбора с ними, чтобы пользователь мог выбрать, какой голос он хочет.

Внутри обработчика inputForm.onsubmit мы останавливаем отправку формы с помощью preventDefault(), используйте constructor для создания нового экземпляра высказывания, содержащего текст из текста <input>, установите voiceна голос, выбранный в элементе <select> и начните высказывание через SpeechSynthesis.speak() метод.

var synth = window.speechSynthesis;

var inputForm = document.querySelector("form");
var inputTxt = document.querySelector("input");
var voiceSelect = document.querySelector("select");

var voices = synth.getVoices();

for (i = 0; i < voices.length; i++) {
  var option = document.createElement("option");
  option.textContent = voices[i].name + " (" + voices[i].lang + ")";
  option.setAttribute("data-lang", voices[i].lang);
  option.setAttribute("data-name", voices[i].name);
  voiceSelect.appendChild(option);
}

inputForm.onsubmit = function (event) {
  event.preventDefault();

  var utterThis = new SpeechSynthesisUtterance(inputTxt.value);
  var selectedOption = voiceSelect.selectedOptions[0].getAttribute("data-name");
  for (i = 0; i < voices.length; i++) {
    if (voices[i].name === selectedOption) {
      utterThis.voice = voices[i];
    }
  }
  synth.speak(utterThis);
  inputTxt.blur();
};

Спецификации

Specification
Web Speech API # speechsynthesisutterance

Совместимость с браузерами

Смотрите также

Web Speech API