本文主要介绍如何在JS应用中进行语音识别。 有一定的参考价值。 有兴趣的同学可以参考一下。 希望您读完这篇文章后能有所收获。 让小编带你来了解一下吧。 。
语音识别是计算机科学和计算语言学的跨学科子领域。 它识别口语并将其翻译成文本。 它也称为手动语音识别 (ASR)、计算机语音识别或语音转文本 (STT)。
机器学习 (ML) 是人工智能 (AI) 的一种应用，它使系统能够手动学习并根据经验进行改进，而无需显式编程。 机器学习带来了本世纪大部分语音识别突破。 如今识别网站程序，语音识别技术无处不在，例如苹果 Siri、亚马逊 Echo 和谷歌 Nest。
语音识别和语音响应（也称为语音合成或文本转语音 (TTS)）由 Webspeech API 提供支持。
在本文中，我们重点关注 JavaScript 应用程序中的语音识别。 另一篇文章介绍了语音合成。
语音识别插座
SpeechRecognition 是识别服务的控制器套接字，在 Chrome 中称为 webkitSpeechRecognition。 SpeechRecognition 处理从识别服务发送的 SpeechRecognitionEvents。 SpeechRecognitionEvent.results 返回一个 SpeechRecognitionResultList 对象，该对象表示当前会话的所有语音识别结果。
可以使用以下代码行初始化 SpeechRecognition：
// 创建一个SpeechRecognition对象
const recognition = new webkitSpeechRecognition();
// 配置设置以使每次识别都返回连续结果
recognition.continuous = true;
// 配置应返回临时结果的设置
recognition.interimResults = true;
// 正确识别单词或短语时的事件处理程序
recognition.onresult = function (event) {
console.log(event.results);
};
ognition.start() 启动语音识别，而 ognition.stop() 停止语音识别，也可以终止（recognition.abort）。
当页面访问您的耳机时，地址栏中会出现扬声器图标，表明耳机已打开并正在运行。
我们用短语与页面交谈。 “你好逗号，我正在说句号。” onresult 在我们谈话时显示所有临时结果。
以下是此示例的 HTML 代码：
Speech Recognition window.onload = () => { const button = document.getElementById('button'); button.addEventListener('click', () => { if (button.style['animation-name'] === 'flash') { recognition.stop(); button.style['animation-name'] = 'none'; button.innerText = 'Press to Start'; content.innerText = ''; } else { button.style['animation-name'] = 'flash'; button.innerText = 'Press to Stop'; recognition.start(); } }); const content = document.getElementById('content'); const recognition = new webkitSpeechRecognition(); recognition.continuous = true; recognition.interimResults = true; recognition.onresult = function (event) { let result = ''; for (let i = event.resultIndex; i < event.results.length; i++) { result += event.results[i][0].transcript; } content.innerText = result; }; }; button { background: yellow; animation-name: none; animation-duration: 3s; animation-iteration-count: infinite; } @keyframes flash { 0% { background: red; } 50% { background: green; } }
第 25 行创建 SpeechRecognition 对象，第 26 行和第 27 行配置 SpeechRecognition 对象。
当一个短语或句子被正确识别时，第 28-34 行会设置一个风暴处理程序。
第 19 行启动语音识别，第 12 行停止语音识别。
第12行，点击该键后，仍然可能会复制出一些消息。 这是由于 Recognition.stop() 尝试返回迄今为止捕获的 SpeechRecognitionResult。 如果您希望它完全停止，请改用 ognition.abort() 。
您会听到动画键的代码（第 38-51 行）比语音识别代码长。 这是该示例的视频剪辑：
这是浏览器兼容性表：
在线语音识别依赖于浏览器自身的语音识别引擎。 在 Chrome 中，该引擎在云端执行识别。 因此，它只能在线工作。
语音识别库
有一些开源语音识别库，以下是基于 npm 趋势的此类库的列表：
1.安阳
Annyang 是一个 JavaScript 语音识别库，用于通过语音命令控制网站。 它构建在 SpeechRecognitionWebAPI 之上。 在下一节中识别网站程序，我们将举例说明 annyang 的工作原理。
2.artyom.js
artyom.js 是一个 JavaScript 语音识别和语音合成库。 它基于 Web Speech API 构建，除了语音命令之外，它还提供语音响应。
3.咕哝
Mumble 是一个 JavaScript 语音识别库，用于通过语音命令控制网站。 它构建在 SpeechRecognitionWebAPI 之上，这与 annyang 的工作方式类似。
4.julius.js
Julius 是一款高性能、占用空间小的大词汇量连续语音识别 (LVCSR) 解码器软件，适用于语音相关研究人员和开发人员。 它可以在从微型计算机到云服务器的各种计算机和设备上进行实时解码。 Julis 是使用 C 语言构建的，julius.js 是 Julius 认为的 JavaScript 的移植版本。
5.语音命令.js
voice-commands.js 是一个 JavaScript 语音识别库，用于通过语音命令控制网站。 它构建在 SpeechRecognitionWebAPI 之上，这与 annyang 的工作方式类似。
安阳
Annyang初始化一个SpeechRecognition对象，其定义如下：
var SpeechRecognition = root.SpeechRecognition || root.webkitSpeechRecognition || root.mozSpeechRecognition || root.msSpeechRecognition || root.oSpeechRecognition;
有一些 API 可以启动或停止 annyang：
以下是此示例的 HTML 代码：
Annyang <script src="//cdnjs.cloudflare.com/ajax/libs/annyang/2.6.1/annyang.min.js"> window.onload = () => { const button = document.getElementById('button'); button.addEventListener('click', () => { if (button.style['animation-name'] === 'flash') { annyang.pause(); button.style['animation-name'] = 'none'; button.innerText = 'Press to Start'; content.innerText = ''; } else { button.style['animation-name'] = 'flash'; button.innerText = 'Press to Stop'; annyang.start(); } }); const content = document.getElementById('content'); const commands = { hello: () => { content.innerText = 'You said hello.'; }, 'hi *splats': (name) => { content.innerText = `You greeted to ${name}.`; }, 'Today is :day': (day) => { content.innerText = `You said ${day}.`; }, '(red) (green) (blue)': () => { content.innerText = 'You said a primary color name.'; }, }; annyang.addCommands(commands); }; button { background: yellow; animation-name: none; animation-duration: 3s; animation-iteration-count: infinite; } @keyframes flash { 0% { background: red; } 50% { background: green; } }
第 7 行添加 annyang 源代码。
20 号线始发 annyang，13 号线暂停 annyang。
Annyang 提供语音命令来控制网页（第 26-42 行）。
第 27 行是一个简单的命令。 如果用户说你好，页面会回复“你说‘你好’”。
第 30 行是一个带有 splats 的命令，它贪婪地捕获命令末尾的多单词文本。 如果你说“嗨，爱丽丝”，它的回应是“你向爱丽丝问好”。 如果你说“嗨，爱丽丝和约翰”，它的答案是“你向爱丽丝和约翰问好”。
第 33 行是带有命名变量的命令。 星期几被捕获为日并在响应中调用。
第 36 行是带有可选短语的命令。 如果你说“黄色”，请忽略它。 如果您提到任何一种原色，则响应将是“您说了原色的名称”。
从第 26 行到第 39 行定义的所有命令都添加到第 41 行的 annyang。
...
结束
我们已经了解 JavaScript 应用程序中的语音识别，并且 Chrome 为 Web Speech API 提供了最好的支持。 我们所有的示例都是在 Chrome 浏览器上实现和测试的。
在探索 Web Speech API 时，这里有一些提示： 如果您不想在日常生活中收听，请记住关闭语音识别应用程序。
什么是 JavaScript
JS是JavaScript的缩写。 它是一种音译脚本语言。 它的类库称为JavaScript引擎。 它是浏览器的一部分。 主要用于网页开发，可以给网站添加各种动态。 效果使网页更加美观。
感谢您仔细阅读本文。 希望小编分享的《如何在JS应用中进行语音识别》这篇文章对大家有所帮助。 也希望您支持易速云，关注易速云行业资讯频道。 ，还有更多相关知识等你来学习！
发表评论