Ciąg dalszy Audio – rozpoznawanie mowy

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
Podziel się na:
    Facebook email PDF Wykop Twitter

1
Dodaj komentarz

avatar
1 Wątki
0 Odpowiedzi
0 Śledzący
 
Komentarz z największą liczbą reakcji
Najczęściej komentowany wątek
1 Komentarze autora
lustfingers Ostatnie komentarze autora

This site uses Akismet to reduce spam. Learn how your comment data is processed.

  Subskrybuj  
Powiadom o
lustfingers
Gość
lustfingers

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.