瀏覽器的語音識別功能

你能用這兒的代碼片段輕鬆地為個人網站添加語音識別功能，而且僅用原生的javascript就可實現。

上周四我有幸在西雅圖的Code Fellows大會上就瀏覽器中的語音識別發了言。

當時許多人驚訝於用原生javascript為個人網站添加語音識別功能竟如此簡單。因此我覺得可以在這裡分享一些代碼片段，目前這些代碼只在Chrome下工作。

識別語音

你可以將語音轉化為文字：

var sr = new webkitSpeechRecognition();sr.onresult = function (evt) { console.log(evt.results[0][0].transcript);}sr.start();

你也同樣可以得到結果的置信水平（置信水平指特定個體對特定命題真實性相信的程度）：

var sr = new webkitSpeechRecognition();sr.onresult = function (evt) { console.log(evt.results[0][0].transcript, evt.results[0][0].confidence);}sr.start();

你可以得到中間結果：

sr.interimResults = true;// false by defaultsr.onresult = function(evt) {for (var i = 0; i < evt.results.length; ++i) {console.log(evt.results[i][0].transcript);};};

或是已識別語音的幾種不同選擇結果：

sr.maxAlternatives = 10;// default = 1sr.onresult = function(evt) {for (var i = 0; i < evt.results[0].length; ++i) {console.log(evt.results[0][i].transcript);}}

你可以設定一種語言，以便改進：

sr.lang = pl-PL

以上所有將在你講話停止時停止識別。為避免識別中途停止，你需要設置 continuous 標誌位為true。

另外，這樣會導致每段語音都被當作中間結果，因此你同樣需要更新onresult回調函數：

sr.continuous = true;// false by defaultsr.onresult = function(evt) {console.log(evt.results[evt.results.length-1][0].transcript);};

JS中的語音識別對象除了onresult,還有以下可用的回調函數：

sr.onstart = function() { console.log("onstart"); }sr.onend = function() { console.log("onend"); }sr.onspeechstart = function() { console.info("speech start"); }sr.onspeechend = function() { console.info("speech end"); }

輸出語音：

var msg = new SpeechSynthesisUtterance(Hi, Im Jakub!);speechSynthesis.speak(msg);

你也可以改變輸出的發音：

var voices = window.speechSynthesis.getVoices();msg.voice = voices[10]; // Note: some voices dont support altering params

下面是其他可以設置的選項：

msg.volume = 1; // 0 to 1msg.pitch = 2; //0 to 2msg.text = Hello World;msg.lang = en-US;msg.onend = function(e) {console.log(Finished in + event.elapsedTime + seconds.);};

總結

語音識別在瀏覽器中的應用已不可能逆轉，問題是大多數網站會在何時增加對語音的支持。

下面的三個有關語音識別介面的鏈接或許對你有幫助：