Начало работы с API распознавания речи в Javascript

Распознавание речи JavaScript API позволяет веб-разработчикам включать распознавание речи в вашу веб-страницу. Этот API позволяет точно контролировать и гибко использовать возможности распознавания речи в Chrome версии 25 и более поздних. Этот API является экспериментальным, это означает, что он доступен не во всех браузерах. Даже в Chrome есть некоторые атрибуты API, которые не поддерживаются. Для получения дополнительной информации посетите Могу ли я использовать распознавание речи.

В этой статье вы узнаете, как использовать API распознавания речи в его наиболее простом выражении.

Реализация

Для начала вам нужно знать, поддерживает ли браузер API или нет. Для этого вы можете проверить, имеет ли объект окна в браузере свойство webkitSpeechRecognition, используя любой из следующих фрагментов:

if (!('webkitSpeechRecognition' in window)) {
alert("Unable to use the Speech Recognition API");
}
// Or
if (!window.hasOwnProperty("webkitSpeechRecognition")) {
alert("Unable to use the Speech Recognition API");
}
// Or
if(typeof(webkitSpeechRecognition) != "function"){
alert("Unable to use the Speech Recognition API");
}

После проверки вы можете начать работать с этим API. Создайте новый экземпляр webkitSpeechRecognition Класс и установить основные свойства:

// Create a new instance of SpeechRecognition
var recognition = new webkitSpeechRecognition();
// Define whether continuous results are returned for each recognition
// or only a single result. Defaults to false
recognition.continuous = true;
// Controls whether interim results should be returned
// Interim results are results that are not yet final
// (e.g. the SpeechRecognitionResult.isFinal property is false.)
recognition.interimResults = true;
// Returns and sets the language of the current SpeechRecognition.
// If not specified, this defaults to the HTML lang attribute value
// or the user agent's language setting if that isn't set either.
// There are a lot of supported languages (go to supported languages at the end of the article)
recognition.lang = "en-US";

Теперь, когда основные параметры установлены, вам нужно добавить некоторые обработчики событий. В этом случае мы собираемся добавить основных слушателей как onerror, onstart , onend а также onresult (событие, используемое для получения распознанного текста).

OnError

// Fired when an error happens with the speech recognition
// With all the following erro codes:
// info-blocked
// info-denied
// no-speech
// aborted
// audio-capture
// network
// not-allowed
// service-not-allowed
// bad-grammar
// language-not-supported
// recognition_overlap
recognition.onerror = function(event) {
console.error(event);
};

OnStart

// will run when the speech recognition
// service has began listening to incoming audio
recognition.onstart = function() {
console.log('Speech recognition service has started');
};

под конец

// run when the speech recognition service has disconnected
// (automatically or forced with recognition.stop())
recognition.onend = function() {
console.log('Speech recognition service disconnected');
};

onresult

// This event is triggered when the speech recognition service
// returns a result — a word or phrase has been positively
//recognized and this has been communicated back to your app
recognition.onresult = function(event) {
var interim_transcript = '';
var final_transcript = '';
for (var i = event.resultIndex; i < event.results.length; ++i) {
// Verify if the recognized text is the last with the isFinal property
if (event.results[i].isFinal) {
final_transcript += event.results[i][0].transcript;
} else {
interim_transcript += event.results[i][0].transcript;
}
}
// Choose which result may be useful for you
console.log("Interim: ", interim_transcript);
console.log("Final: ",final_transcript);
console.log("Simple: ", event.results[0][0].transcript);
};

Событие onresult получает в качестве первого параметра пользовательский четный объект. Результаты хранятся в event.results свойство (объект типа SpeechRecognitionResultList который хранит SpeechRecognitionResult объекты, это в свою очередь содержит экземпляры SpeechRecognitionAlternative со свойством transcript, содержащим текст).

В качестве последнего шага, вам нужно запустить его, выполнив start метод объекта распознавания или остановить его, когда он работает, выполняя stop метод:

// start the speech recognition
recognition.start();
// Stop the speech recognition
recognition.stop();

Теперь весь функциональный фрагмент для использования API распознавания речи должен выглядеть следующим образом:

var recognition = new webkitSpeechRecognition();
recognition.continuous = true;
recognition.interimResults = true;
recognition.lang = "en-US";
recognition.onerror = function(event) {
console.error(event);
};
recognition.onstart = function() {
console.log('Speech recognition service has started');
};
recognition.onend = function() {
console.log('Speech recognition service disconnected');
};
recognition.onresult = function(event) {
var interim_transcript = '';
var final_transcript = '';
for (var i = event.resultIndex; i < event.results.length; ++i) {
// Verify if the recognized text is the last with the isFinal property
if (event.results[i].isFinal) {
final_transcript += event.results[i][0].transcript;
} else {
interim_transcript += event.results[i][0].transcript;
}
}
// Choose which result may be useful for you
console.log("Interim: ", interim_transcript);
console.log("Final: ",final_transcript);
console.log("Simple: ", event.results[0][0].transcript);
};
recognition.start();

Как только вы запустите метод запуска, в браузере отобразится диалоговое окно разрешения микрофона.

Попробуйте это на своем веб-или локальном сервере. Вы можете увидеть живую демонстрацию API распознавания речи, работающую в браузере на всех доступных языках из официальных демонстраций Chrome, здесь.

Поддерживаемые языки

В настоящее время API поддерживает 40 языков в Chrome. Некоторые языки имеют специальные коды в зависимости от региона (идентификаторы следуют формат BCP-47):

Вы можете использовать следующий объект, если вам нужна предыдущая таблица в Javascript, и вы можете повторить ее, как показано в примере:

var allAvailableLanguages = [
{
"language": "Afrikaans",
"countryCodes": [
{
"langCode": "af-ZA",
"country": "Default"
}
]
},
{
"language": "Bahasa Indonesia",
"countryCodes": [
{
"langCode": "id-ID",
"country": "Default"
}
]
},
{
"language": "Bahasa Melayu",
"countryCodes": [
{
"langCode": "ms-MY",
"country": "Default"
}
]
},
{
"language": "Català",
"countryCodes": [
{
"langCode": "ca-ES",
"country": "Default"
}
]
},
{
"language": "Čeština",
"countryCodes": [
{
"langCode": "cs-CZ",
"country": "Default"
}
]
},
{
"language": "Dansk",
"countryCodes": [
{
"langCode": "da-DK",
"country": "Default"
}
]
},
{
"language": "Deutsch",
"countryCodes": [
{
"langCode": "de-DE",
"country": "Default"
}
]
},
{
"language": "English",
"countryCodes": [
{
"langCode": "en-AU",
"country": "Australia"
},
{
"langCode": "en-CA",
"country": "Canada"
},
{
"langCode": "en-IN",
"country": "India"
},
{
"langCode": "en-NZ",
"country": "New Zealand"
},
{
"langCode": "en-ZA",
"country": "South Africa"
},
{
"langCode": "en-GB",
"country": "United Kingdom"
},
{
"langCode": "en-US",
"country": "United States"
}
]
},
{
"language": "Español",
"countryCodes": [
{
"langCode": "es-AR",
"country": "Argentina"
},
{
"langCode": "es-BO",
"country": "Bolivia"
},
{
"langCode": "es-CL",
"country": "Chile"
},
{
"langCode": "es-CO",
"country": "Colombia"
},
{
"langCode": "es-CR",
"country": "Costa Rica"
},
{
"langCode": "es-EC",
"country": "Ecuador"
},
{
"langCode": "es-SV",
"country": "El Salvador"
},
{
"langCode": "es-ES",
"country": "España"
},
{
"langCode": "es-US",
"country": "Estados Unidos"
},
{
"langCode": "es-GT",
"country": "Guatemala"
},
{
"langCode": "es-HN",
"country": "Honduras"
},
{
"langCode": "es-MX",
"country": "México"
},
{
"langCode": "es-NI",
"country": "Nicaragua"
},
{
"langCode": "es-PA",
"country": "Panamá"
},
{
"langCode": "es-PY",
"country": "Paraguay"
},
{
"langCode": "es-PE",
"country": "Perú"
},
{
"langCode": "es-PR",
"country": "Puerto Rico"
},
{
"langCode": "es-DO",
"country": "República Dominicana"
},
{
"langCode": "es-UY",
"country": "Uruguay"
},
{
"langCode": "es-VE",
"country": "Venezuela"
}
]
},
{
"language": "Euskara",
"countryCodes": [
{
"langCode": "eu-ES",
"country": "Default"
}
]
},
{
"language": "Filipino",
"countryCodes": [
{
"langCode": "fil-PH",
"country": "Default"
}
]
},
{
"language": "Français",
"countryCodes": [
{
"langCode": "fr-FR",
"country": "Default"
}
]
},
{
"language": "Galego",
"countryCodes": [
{
"langCode": "gl-ES",
"country": "Default"
}
]
},
{
"language": "Hrvatski",
"countryCodes": [
{
"langCode": "hr_HR",
"country": "Default"
}
]
},
{
"language": "IsiZulu",
"countryCodes": [
{
"langCode": "zu-ZA",
"country": "Default"
}
]
},
{
"language": "Íslenska",
"countryCodes": [
{
"langCode": "is-IS",
"country": "Default"
}
]
},
{
"language": "Italiano",
"countryCodes": [
{
"langCode": "it-IT",
"country": "Italia"
},
{
"langCode": "it-CH",
"country": "Svizzera"
}
]
},
{
"language": "Lietuvių",
"countryCodes": [
{
"langCode": "lt-LT",
"country": "Default"
}
]
},
{
"language": "Magyar",
"countryCodes": [
{
"langCode": "hu-HU",
"country": "Default"
}
]
},
{
"language": "Nederlands",
"countryCodes": [
{
"langCode": "nl-NL",
"country": "Default"
}
]
},
{
"language": "Norsk bokmål",
"countryCodes": [
{
"langCode": "nb-NO",
"country": "Default"
}
]
},
{
"language": "Polski",
"countryCodes": [
{
"langCode": "pl-PL",
"country": "Default"
}
]
},
{
"language": "Português",
"countryCodes": [
{
"langCode": "pt-BR",
"country": "Brasil"
},
{
"langCode": "pt-PT",
"country": "Portugal"
}
]
},
{
"language": "Română",
"countryCodes": [
{
"langCode": "ro-RO",
"country": "Default"
}
]
},
{
"language": "Slovenščina",
"countryCodes": [
{
"langCode": "sl-SI",
"country": "Default"
}
]
},
{
"language": "Slovenčina",
"countryCodes": [
{
"langCode": "sk-SK",
"country": "Default"
}
]
},
{
"language": "Suomi",
"countryCodes": [
{
"langCode": "fi-FI",
"country": "Default"
}
]
},
{
"language": "Svenska",
"countryCodes": [
{
"langCode": "sv-SE",
"country": "Default"
}
]
},
{
"language": "Tiếng Việt",
"countryCodes": [
{
"langCode": "vi-VN",
"country": "Default"
}
]
},
{
"language": "Türkçe",
"countryCodes": [
{
"langCode": "tr-TR",
"country": "Default"
}
]
},
{
"language": "Ελληνικά",
"countryCodes": [
{
"langCode": "el-GR",
"country": "Default"
}
]
},
{
"language": "български",
"countryCodes": [
{
"langCode": "bg-BG",
"country": "Default"
}
]
},
{
"language": "Pусский",
"countryCodes": [
{
"langCode": "ru-RU",
"country": "Default"
}
]
},
{
"language": "Српски",
"countryCodes": [
{
"langCode": "sr-RS",
"country": "Default"
}
]
},
{
"language": "Українська",
"countryCodes": [
{
"langCode": "uk-UA",
"country": "Default"
}
]
},
{
"language": "한국어",
"countryCodes": [
{
"langCode": "ko-KR",
"country": "Default"
}
]
},
{
"language": "中文",
"countryCodes": [
{
"langCode": "cmn-Hans-CN",
"country": "普通话 (中国大陆)"
},
{
"langCode": "cmn-Hans-HK",
"country": "普通话 (香港)"
},
{
"langCode": "cmn-Hant-TW",
"country": "中文 (台灣)"
},
{
"langCode": "yue-Hant-HK",
"country": "粵語 (香港)"
}
]
},
{
"language": "日本語",
"countryCodes": [
{
"langCode": "ja-JP",
"country": "Default"
}
]
},
{
"language": "हिन्दी",
"countryCodes": [
{
"langCode": "hi-IN",
"country": "Default"
}
]
},
{
"language": "ภาษาไทย",
"countryCodes": [
{
"langCode": "th-TH",
"country": "Default"
}
]
}
];
allAvailableLanguages.forEach(function(item){
if(item.countryCodes.length > 1){
var allCountries = "";
console.log(item.language + " ("+item.countryCodes.length+" country(s)) ");
item.countryCodes.forEach(function(countryItem){
console.log("   "+countryItem.country + " | "+ countryItem.langCode);
});
}else{
console.log(item.language + " ["+item.countryCodes[0].langCode+"]");
}
});

Чей вывод в консоли будет:

// Afrikaans [af-ZA]
// Bahasa Indonesia [id-ID]
// Bahasa Melayu [ms-MY]
// Català [ca-ES]
// Čeština [cs-CZ]
// Dansk [da-DK]
// Deutsch [de-DE]
// English (7 country(s))
//     Australia | en-AU
//     Canada | en-CA
//     India | en-IN
//     New Zealand | en-NZ
//     South Africa | en-ZA
//     United Kingdom | en-GB
//     United States | en-US
// Español (20 country(s))
//     Argentina | es-AR
//     Bolivia | es-BO
//     Chile | es-CL
//     Colombia | es-CO
//     Costa Rica | es-CR
//     Ecuador | es-EC
//     El Salvador | es-SV
//     España | es-ES
//     Estados Unidos | es-US
//     Guatemala | es-GT
//     Honduras | es-HN
//     México | es-MX
//     Nicaragua | es-NI
//     Panamá | es-PA
//     Paraguay | es-PY
//     Perú | es-PE
//     Puerto Rico | es-PR
//     República Dominicana | es-DO
//     Uruguay | es-UY
//     Venezuela | es-VE
// Euskara [eu-ES]
// Filipino [fil-PH]
// Français [fr-FR]
// Galego [gl-ES]
// Hrvatski [hr_HR]
// IsiZulu [zu-ZA]
// Íslenska [is-IS]
// Italiano (2 country(s))
//     Italia | it-IT
//     Svizzera | it-CH
// Lietuvių [lt-LT]
// Magyar [hu-HU]
// Nederlands [nl-NL]
// Norsk bokmål [nb-NO]
// Polski [pl-PL]
// Português (2 country(s))
//     Brasil | pt-BR
//     Portugal | pt-PT
// Română [ro-RO]
// Slovenščina [sl-SI]
// Slovenčina [sk-SK]
// Suomi [fi-FI]
// Svenska [sv-SE]
// Tiếng Việt [vi-VN]
// Türkçe [tr-TR]
// Ελληνικά [el-GR]
// български [bg-BG]
// Pусский [ru-RU]
// Српски [sr-RS]
// Українська [uk-UA]
// 한국어 [ko-KR]
// 中文 (4 country(s))
//     普通话 (中国大陆) | cmn-Hans-CN
//     普通话 (香港) | cmn-Hans-HK
//     中文 (台灣) | cmn-Hant-TW
//     粵語 (香港) | yue-Hant-HK
// 日本語 [ja-JP]
// हिन्दी [hi-IN]
// ภาษาไทย [th-TH]