用 80 行 Javascript 代码构建自己的语音助手

最新推荐文章于 2024-04-25 15:13:31 发布

无聊的狗子

最新推荐文章于 2024-04-25 15:13:31 发布

阅读量523

点赞数 1

本文链接：https://blog.csdn.net/qq_48793913/article/details/107431286

版权

在本教程中，我们将使用 80 行 JavaScript 代码在浏览器中构建一个虚拟助理（如 Siri 或 Google 助理）。你可以在这里测试这款应用程序，它将会听取用户的语音命令，然后用合成语音进行回复。

你所需要的是：

Google Chrome （版本 25 以上）
一款文本编辑器

由于 Web Speech API 仍处于试验阶段，该应用程序只能在受支持的浏览器上运行：Chrome（版本 25 以上）和 Edge（版本 79 以上）。

我们需要构建哪些组件？

要构建这个 Web 应用程序，我们需要实现四个组件：

一个简单的用户界面，用来显示用户所说的内容和助理的回复。
将语音转换为文本。
处理文本并执行操作。
将文本转换为语音。

用户界面

第一步就是创建一个简单的用户界面，它包含一个按钮用来触发助理，一个用于显示用户命令和助理响应的 div 、一个用于显示处理信息的 p 组件。

 复制代码

conststartBtn =document.createElement("button");
startBtn.innerHTML ="Start listening";
constresult =document.createElement("div");
constprocessing =document.createElement("p");
document.write("<body><h1>My Siri</h1><p>Give it a try with 'hello', 'how are you', 'what's your name', 'what time is it', 'stop', ... </p></body>");
document.body.append(startBtn);
document.body.append(result);
document.body.append(processing);

语音转文本

我们需要构建一个组件来捕获语音命令并将其转换为文本，以进行进一步处理。在本教程中，我们使用

最低0.47元/天解锁文章

无聊的狗子

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
用 80 行 Javascript 代码构建自己的语音助手

在本教程中，我们将使用 80 行 JavaScript 代码在浏览器中构建一个虚拟助理（如 Siri 或 Google 助理）。你可以在这里测试这款应用程序，它将会听取用户的语音命令，然后用合成语音进行回复。你所需要的是：Google Chrome（版本 25 以上）一款文本编辑器由于 Web Speech API 仍处于试验阶段，该应用程序只能在受支持的浏览器上运行：Chrome（版本 25 以上）和 Edge（版本 79 以上）。我们需要构建哪些组件？要构建这个 Web ...
复制链接

扫一扫