Ciąg dalszy Audio – rozpoznawanie mowy

Cześć! Cieszę się, że mnie odwiedziłeś/aś. Zanim przejdziesz do artykułu chciałbym zwrocić Ci uwagę na to, że ten artykuł był pisany kilka lat temu (2016-02-20) miej więc proszę na uwadzę że rozwiązania i przemyślenia które tu znajdziesz nie muszą być aktualne. Niemniej jednak zachęcam do przeczytania.

Witam ponownie ;)

Przy okazji zbierania materiałów na poprzedni wpis natknąłem się na możliwość rozpoznawania mowy. To na tyle fajne zagadnienie że postanowiłem napisać osobny wpis na ten temat.

A więc specyfikację możecie sobie zobaczyć tutaj.

Od razu zaznaczę iż używać tego możemy na razie tylko w Google Chrome – zerknij na Can I use.

Zacznijmy od kawałka HTMLa:

1
2
3
4
5
6
7
8
9
<html>
<head>
</head>
<body>
<div style="width:50%;height:50%;border:2px solid;margin: 0 auto;" id="result">
</div>
</body>
<script type="text/javascript" src="main.js"></script>
</html>

Wynik rozpoznawania będziemy pisać do tego diva #result.

I kawałek JSa:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var resultElement = document.getElementById("result");

var handleResult = function(results){
  var result = results[results.length-1];
  resultElement.innerHTML = result[0].transcript;
}

var recognition = new webkitSpeechRecognition();
recognition.lang = "pl-PL";
recognition.continuous = true;
recognition.interimResults = true;
recognition.onresult = function(event) {
  console.log(event)
  handleResult(event.results);
}
recognition.start();

Używamy obiektu klasy webkitSpeechRecognition. Ustawiamy mu język polski. Opcja continuous pozwala na ciągłe przetwarzanie głosu – tzn będzie przetwarzać głos mimo odebrania pierwszego finalnego rezultatu. Ustawienie pola interimResults pozwala nam uzyskiwać nie ostateczne rezultaty. Czyli będziemy na ekranie widzieć cały proces dopasowywania dźwięku, przykładowo jeśli powiemy np. słowo „motor” to pierwszym słowem które znajdzie będzie słowo „moto” a następnym już „motor” i słowo „motor” będzie słowem finalnym a słowo „moto” słowem w procesie dopasowywania które będzie widoczne na ekranie dzięki własnie opcji interimResults .

Hahahah całkiem ciekawą rzeczą jest że on cenzuruje bluźnierstwa ;) co znaczy że jeśli powiem mu brzydkie słowo na „k” to rezultat będzie „k****”.

Zapraszam do pobawienia się:

DEMO

Dzięki za wizytę,
Mateusz Mazurek
Mateusz M.

Pokaż komentarze

  • Całkiem fajnie to wygląda, mam tylko jedno pytanie czy jest możliwość zrobienia przycisku który to będzie uruchamiał? Wyobrażam sobie sytuację że ktoś to zaimplementuje na swojej stronie w wyszukiwarce, osoba przeglądająca taką stronę dostając od razu komunikat o tym że chcemy dostępu do mikrofonu po prostu ucieknie nie wiedząc po co to nam. taki przycisk np. przy wyszukiwarce coś jak w google byłby super dopełnieniem całości.

Ostatnie wpisy

Podsumowanie: luty i marzec 2024

Ostatnio tygodnie były tak bardzo wypełnione, że nie udało mi się napisać nawet krótkiego podsumowanie. Więc dziś zbiorczo podsumuję luty… Read More

2 tygodnie ago

Podsumowanie: styczeń 2024

Zapraszam na krótkie podsumowanie miesiąca. Książki W styczniu przeczytałem "Homo Deus: Historia jutra". Książka łudząco podoba do wcześniejszej książki tego… Read More

3 miesiące ago

Podsumowanie roku 2023

Cześć! Zapraszam na podsumowanie roku 2023. Książki Zacznijmy od książek. W tym roku cel 35 książek nie został osiągnięty. Niemniej… Read More

4 miesiące ago

Podsumowanie: grudzień 2023

Zapraszam na krótkie podsumowanie miesiąca. Książki W grudniu skończyłem czytać Mein Kampf. Nudna książka. Ciekawsze fragmenty można by było streścić… Read More

4 miesiące ago

Praca zdalna – co z nią dalej?

Cześć, ostatnio w Internecie pojawiło się dużo artykułów, które nie były przychylne pracy zdalnej. Z drugiej strony większość komentarzy pod… Read More

4 miesiące ago

Podsumowanie: listopad 2023

Zapraszam na krótkie podsumowanie miesiąca. Książki W listopadzie dokończyłem cykl "Z mgły zrodzony" Sandersona. Tylko "Stop prawa" mi nie do… Read More

5 miesięcy ago