Web Speech API. Распознавание речи

Последнее обновление: 16.11.2023

Распознавание речи управляется объектом SpeechRecognition. Для его получения применяется свойство webkitSpeechRecognition глобального объекта window, через которое мы можем проверить поддержку распознавания текущим браузером:

if(window.webkitSpeechRecognition) {
    console.log("Распознавание речи поддерживается");
} else {
    console.log("Распознавание речи НЕ поддерживается");
}
// Альтернативный способ проверки
if("webkitSpeechRecognition" in window) {  
    console.log("Распознавание речи поддерживается");
} else {
    console.log("Распознавание речи НЕ поддерживается");
}

Префикс webkit в название свойства намекает, что это свойство поддерживается только в браузерах на движке WebKit. Соответственно в реальности в браузерах на движке WebKit распознавание будет осуществляться с помощью объекта webkitSpeechRecognition, а не SpeechRecognition.

Интерфейс SpeechRecognition предоставляет ряд свойств для настройки распознавания:

  • grammars: возвращает и устанавливает коллекцию объектов SpeechGrammar, которые представляют используемые грамматики

  • lang: возвращает и устанавливает язык распознавания. Если не указано, по умолчанию используется значение атрибута lang корневого элемента <html>

  • continious: определяет, возвращаются ли непрерывные результаты для каждого распознавания (значение true) или только один результат (значение false). По умолчанию возвращается только один результат

  • interimResults: определяет, следует ли возвращать промежуточные результаты (true) или нет (false). Промежуточные результаты — это результаты, которые еще не являются окончательными (например, свойство SpeechRecognitionResult.isFinal имеет значение false).

  • maxAlternatives: устанавливает максимальное количество вариантов распознавания, предоставляемых для каждого результата. Значение по умолчанию — 1.

Для управления распознаванием для SpeechRecognition определено три метода:

  • abort(): прерывает распознавание, не позволяя службе распознавания прослушивать входящий звук и не пытаясь вернуть SpeechRecognitionResult

  • start(): запускает распознавание.

  • stop(): останавливает распознавание, не позволяет службе распознавания речи прослушивать входящий звук и пытается вернуть SpeechRecognitionResult, используя записанный на данный момент звук

После запуска распознавания речи методом start() в процессе распознавания могут возникать различные события:

  • audiostart: запускается, когда начался захват звука. Доступно через свойство onaudiostart

  • audioend: запускается, когда завершен захват звука. Доступно через свойство onaudioend

  • end: запускается после отключения службы распознавания. Доступно через свойство onend

  • error: запускается при возникновении ошибки. Доступно через свойство onerror

  • nomatch: запускается, когда служба распознавания возвращает финальный результат при неудачном распознавании (степень распознавания не отвечает заданному порогу). Доступно через свойство onnomatch

  • result: запускается, когда служба распознавания возвращает результат — слово или фразу. Доступно через свойство onresult

  • soundstart: запускается, когда был обнаружен звук (вне зависимости речь или случайный шум). Доступно через свойство onsoundstart

  • soundend: запускается после завершения обнаружения звука. Доступно через свойство onsoundend

  • speechstart: запускается, когда служба распознавания обнаружила речь начала распознавать звук. Доступно через свойство onspeechstart

  • speechend: запускается, когда служба распознавания завершила обнаружение речи. Доступно через свойство onspeechend

  • start: запускается, когда служба распознавания начала прослушивать звук. Доступно через свойство onstart

чтобы получить доступ к результату распознавания речи, регистрируется обработчик события result:

const recognition = new webkitSpeechRecognition();
recognition.onresult = function(event){ 
    const results = event.results; // получаем результат распознавания
    console.log(results);   // список SpeechRecognitionResultList
}

Параметр функции-обработчика представляет тип SpeechRecognitionEvent, у которого через свойство results можно получить результаты распознавания в виде списка SpeechRecognitionResultList. Каждая запись в этом списке представляет объект SpeechRecognitionResult и содержит один или несколько вариантов распознавания речи (объектов SpeechRecognitionAlternative) на случай, если распознавание речи было неоднозначным.

const recognition = new webkitSpeechRecognition();
recognition.onresult = function(event){ 
    const results = event.results;  //   получаем список результатов
    const firstResult = results[0]; // получаем первый распознанный результат
    const firstAlternative = firstResult[0];    // получаем первый вариант распознавания
}

Каждая альтернатива (объект SpeechRecognitionAlternative), в свою очередь, имеет два свойства: transcript (содержит распознанный текст) и confidence (уровень уверенности в диапазоне от 0 до 1). Самая первая альтернатива представляет собой результат с наибольшей вероятностью

const recognition = new webkitSpeechRecognition();
recognition.onresult = function(event){ 
    const results = event.results;  //   получаем список результатов
    const firstResult = results[0]; // получаем первый распознанный результат
    const firstAlternative = firstResult[0];    // получаем первый вариант распознавания
    const transcript = firstAlternative.transcript;  //  распознанный текст
    const confidence = firstAlternative.confidence;    // уровень уверенности 
    console.log(transcript);  
    console.log(confidence);
}

Для демонстрации распознавания определим следующую веб-страницу:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>METANIT.COM</title>
</head>
<body>
<button id="startBtn">Start</button>
<button id="stopBtn">Stop</button>
<script>
const recognition = new webkitSpeechRecognition();
let index = 0;
recognition.onresult = function(event){ 
    const results = event.results;  //   получаем список результатов
    const firstResult = results[index++]; // получаем распознанный результат
    const firstAlternative = firstResult[0];    // получаем первый вариант распознавания
    const transcript = firstAlternative.transcript;  //  распознанный текст
    const confidence = firstAlternative.confidence;    // уровень уверенности 
    console.log(transcript);  
    console.log(confidence);
}
// по нажатию на кнопку Start запускаем распознавание
document.getElementById("startBtn").addEventListener("click", ()=>{
    if(window.webkitSpeechRecognition) {
        recognition.continuous = true;
        recognition.lang = "ru";    // распознавание речи на русском языке
        recognition.start();    // начинаем распознавание
    } else {
        console.log("Распознавание речи НЕ поддерживается");
    }
});
// по нажатию на кнопку Stop останавливаем распознавание
document.getElementById("stopBtn").addEventListener("click", ()=>{recognition.stop(); index=0;})
</script>
</body>
</html>

В данном случае по нажатию на кнопку Start запускаем распознавание речи на русском языке. Результаты распознавания выводятся на консоль. При нажатии на кнопку Stop останавливаем распознавание.

Для получения результата определяем переменную index. При каждом срабатывании события result в список распознаваний будет добавляться новый результат распознавания. И, инкрементируя переменную index, мы сможем при последующем срабатывании события result получить распознанный результат по этому индексу.

Стоит отметить, что при запуске распознавания браузер предложит пользователю дать разрешения на использование микрофона:

Web Speech API и распознавание речи в JavaScript

Соответственно если пользователь хочет использовать распознавание речи, то он должен разрешить браузеру доступ к микрофону.

НазадСодержаниеВперед

Помощь сайту
Юмани:
410011174743222
Перевод на карту
Номер карты:
4048415020898850