“In this 10-year time frame, I believe that we’ll not only be using the keyboard and the mouse to interact but during that time we will have perfected speech recognition and speech output well enough ...
“In this 10-year time frame, I believe that we’ll not only be using the keyboard and the mouse to interact but during that time we will have perfected speech recognition and speech output well enough that those will become a standard part of the interface.” — Bill Gates, 1 October 1997
“在这十年的时间里，我相信我们不仅将使用键盘和鼠标进行交互，而且在这段时间内，我们将充分完善语音识别和语音输出，使它们将成为语音识别的标准部分。接口。” —比尔·盖茨，1997年10月1日
Technology has come a long way, and with each new advancement, the human race becomes more attached to it and longs for these new cool features across all devices.
技术已经走了很长一段路，并且随着每一项新的进步，人类变得对它越来越依赖，并且渴望在所有设备上拥有这些新的酷功能。
With the advent of Siri, Alexa, and Google Assistant, users of technology have yearned for speech recognition in their everyday use of the internet. In this post, I’ll be covering how to integrate native speech recognition and speech synthesis in the browser using the JavaScript WebSpeech API.
随着Siri，Alexa和Google Assistant的出现，技术用户已经渴望在日常使用互联网时进行语音识别。 在本文中，我将介绍如何使用JavaScript WebSpeech API在浏览器中集成本机语音识别和语音合成。
According to the Mozilla web docs:
根据Mozilla网络文档：
The Web Speech API enables you to incorporate voice data into web apps. The Web Speech API has two parts: SpeechSynthesis (Text-to-Speech), and SpeechRecognition (Asynchronous Speech Recognition.)
Web Speech API使您可以将语音数据合并到Web应用程序中。 Web语音API有两个部分：语音合成(文本到语音)和语音识别(异步语音识别)。
我们将需要构建我们的应用程序的要求 (Requirements we will need to build our application)
For this simple speech recognition app, we’ll be working with just three files which will all reside in the same directory:
对于这个简单的语音识别应用程序，我们将仅处理三个文件，它们都位于同一目录中：
index.htmlcontaining the HTML for the app.index.html其中包含应用程序HTML。style.csscontaining the CSS styles.包含CSS样式的
style.css。index.jscontaining the JavaScript code.包含JavaScript代码的
index.js。
Also, we need to have a few things in place. They are as follows:
另外，我们需要准备一些东西。 它们如下：
- Basic knowledge of JavaScript. JavaScript的基础知识。
A web server for running the app. The Web Server for Chrome will be sufficient for this purpose.
设置我们的语音识别应用 (Setting up our speech recognition app)
Let’s get started by setting up the HTML and CSS for the app. Below is the HTML markup:
让我们开始为应用程序设置HTML和CSS。 以下是HTML标记：
<!DOCTYPE html>
<html lang="en">
<head>
最低0.47元/天 解锁文章
361
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
