首页 > 代码库 > 浏览器中的语音识别功能

浏览器中的语音识别功能

2024-08-22 08:05:16   220人阅读

你能用这儿的代码片段轻松地为个人网站添加语音识别功能，而且仅用原生的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 default

sr.onresult = function(evt) {

for (var i = 0; i < evt.results.length; ++i) {

console.log(evt.results[i][0].transcript);

};

};

 

或是已识别语音的几种不同选择结果：

sr.maxAlternatives = 10;// default = 1

sr.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 default

sr.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, I\‘m Jakub!‘);

speechSynthesis.speak(msg);

 

你也可以改变输出的发音：

var voices = window.speechSynthesis.getVoices();

msg.voice = voices[10]; // Note: some voices don‘t support altering params

 

下面是其他可以设置的选项：

msg.volume = 1; // 0 to 1

msg.pitch = 2; //0 to 2

msg.text = ‘Hello World‘;

msg.lang = ‘en-US‘;


msg.onend = function(e) {

console.log(‘Finished in ‘ + event.elapsedTime + ‘ seconds.‘);

};

 

总结

 

语音识别在浏览器中的应用已不可能逆转，问题是大多数网站会在何时增加对语音的支持。

下面的三个有关语音识别接口的链接或许对你有帮助：

My GitHub: https://github.com/jj09/voiceCmdr

My Website: http://jj09.net/website-with-speech-recognition-for-free/

My Demo: http://bookslib.azurewebsites.net/#/

注：本文为译文。

原文链接： https://dzones.com/articles/speech-recognition-in-the-brower-1

浏览器中的语音识别功能


联系
我们