2012年底推出的Web Speech API, 使Web开发人员可以在Web浏览器中提供语音输入和文本到语音输出功能。通常, 在使用标准语音识别或屏幕阅读器软件时, 这些功能不可用。该API负责保护用户的隐私。在允许网站通过麦克风访问语音之前, 用户必须明确授予权限。
你需要了解的一些重要事项:
- 仅在日期(23.02.2016)中可用, 仅在Google Chrome中可用。
- 不允许使用本地文件(file://协议), 该文件需要以某种方式托管在服务器(或localhost)中。
以下代码将提供最基本的支持来检索用户所说的内容, 你可以使用interim_transcript和final_transcript向用户显示识别的文本。
var recognition = new webkitSpeechRecognition();
recognition.continuous = true;
recognition.interimResults = true;
recognition.lang = "en-GB";
recognition.onresult = function(event) {
var interim_transcript = '';
for (var i = event.resultIndex; i < event.results.length; ++i) {
if (event.results[i].isFinal) {
final_transcript += event.results[i][0].transcript;
} else {
interim_transcript += event.results[i][0].transcript;
}
}
console.log(interim_transcript, final_transcript);
};
}
Google github中的存储库有一个非常完整的示例(具有许多语言代码, 可防止错误等), 你可以在此处从存储库下载演示。
Artyom.js是webkitSpeechRecognition API的强大包装器库, 它使你可以做一些很棒的技巧, 例如语音命令, 语音提示, 语音合成以及更多功能。在这种情况下, 我们将对artyom.newDictation函数感兴趣。此功能将用更简单的方式包装所有先前的代码, 首先你需要将库包含到你的项目中, 你的html文件应如下所示:
<!DOCTYPE>
<html>
<head>
<title>Dictation example </title>
<script type="text/javascript" src="path/to/artyom.min.js"></script>
</head>
<body>
<input type="button" onclick="startRecognition();" value="Recognize text" />
<input type="button" onclick="stopRecognition();" value="stop recognition" />
<script>
// we will write the javascript here
</script>
</body>
</html>
如果你已经在文档中链接了artyom库, 那么你的javascript将如下所示:
var settings = {
continuous:true, // Don't stop never because i have https connection
onResult:function(text){
// text = the recognized text
console.log(text);
}, onStart:function(){
console.log("Dictation started by the user");
}, onEnd:function(){
alert("Dictation stopped by the user");
}
};
var UserDictation = artyom.newDictation(settings);
function startRecognition(){
UserDictation.start();
}
function stopRecognition(){
UserDictation.stop();
}
你只需要处理初始化, 然后, 魔术将在settings对象的onResult属性中发生。尽管artyom使事情变得容易得多, 但是你需要考虑是否确实需要使用它, 如果你是从本主题开始, 建议使用纯代码, 因此你将了解此api的工作原理以及是否你仍然感兴趣, 可以稍后再使用artyom。
这个api的潜力确实令人难以置信, 但是只有谷歌chrome支持它是一种遗憾。你可以改进前面的所有代码, 例如检测你可以在哪种浏览器中初始化webkitSpeechRecogniton。
评论前必须登录!
注册