- 综合排序
- 最热优先
- 最新优先
- 来自专栏码艺坊
用浏览器语音识别实现“网页版小爱同学”：唤醒功能全解析与实战
要实现浏览器端的语音唤醒，核心依赖WebSpeechAPI中的SpeechRecognition接口（部分浏览器前缀为webkitSpeechRecognition），其工作流程可拆解为3个关键步骤：语音采集 关键注意点浏览器兼容性：目前主流浏览器（Chrome、Edge、Safari14.1+）均支持SpeechRecognition，但需注意Chrome/Edge需使用webkit前缀（即webkitSpeechRecognition JavaScript即可实现，具体准备如下：开发工具：VSCode（推荐安装LiveServer插件，用于本地HTTPS调试）；测试环境：Chrome110+或Edge110+（确保麦克风权限开启）；核心API：webkitSpeechRecognition document.getElementById('wakeWord');//语音识别核心对象（处理浏览器前缀兼容）constSpeechRecognition=window.SpeechRecognition||window.webkitSpeechRecognition 关键在于：利用webkitSpeechRecognition实现语音转文字；通过状态管理（isWoken）区分“唤醒前”和“唤醒后”逻辑；结合SpeechSynthesisAPI提供语音反馈，提升交互体验
1.1K02编辑于 2025-11-17 - 来自专栏前端专享
使用 Web Speech API 和 ChatGPT API 开发一个智能语音机器人
语音识别</button>
<script> const recognition = new webkitSpeechRecognition speechSynthesizer.close() } ) } const SpeechRecognition = window.SpeechRecognition || webkitSpeechRecognition
2.6K30编辑于 2023-04-27 用Vue3+Ts打造一个现代化 AI 聊天助手组件（附代码示例与开发避坑指南）
('SpeechRecognition'inwindow||'webkitSpeechRecognition'inwindow)){alert('浏览器不支持语音识别');return;}constrecognition =new(window.SpeechRecognition||window.webkitSpeechRecognition)();recognition.lang='zh-CN';recognition.continuous 隐藏语音按钮推荐使用第三方库如web-speech-api展开代码语言：TypeScriptAI代码解释constisSpeechSupported='SpeechRecognition'inwindow||'webkitSpeechRecognition'inwindow
1K10编辑于 2025-11-08- 来自专栏深度学习与python
用 80 行 Javascript 代码构建自己的语音助手
const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition; if (typeof SpeechRecognition document.body.append(processing); // speech to text const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition
1.6K20发布于 2020-07-27 - 来自专栏终身学习者
未来网站开发必备：14个让你惊艳的JavaScript Web API！
window.webkitSpeechRecognition; const recognition = new SpeechRecognition(); recognition.start(); recognition.onresult if ("SpeechRecognition" in window || "webkitSpeechRecognition" in window) { // Speech Recognition is
1.1K20编辑于 2023-07-09 - 来自专栏JavaScript高级程序设计
第三十一期：传统前端和多媒体前端
// vue文件里的内容 data() { return { reco: new webkitSpeechRecognition() || new window.SpeechRecognition
48330编辑于 2022-07-15 - 来自专栏Web前端
借助AI，实现语音控制导航系统
function initSpeechRecognition() { const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition function initSpeechRecognition() { const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition
55820编辑于 2025-05-28 - 来自专栏码艺坊
使用浏览器语音API实现语音识别功能
在Chrome浏览器中，创建Recognition对象的方式如下：const recognition = new webkitSpeechRecognition();这里出现了“webkit”前缀，这是在一些浏览器中需要特别注意的地方
1.8K00编辑于 2025-01-07 - 来自专栏北京百思可瑞教育
北京百思可瑞教育：使用UniApp实现一个AI对话页面
''; constructor() { this.recognition = new (window.SpeechRecognition || (window as any).webkitSpeechRecognition
56810编辑于 2025-09-12 - 4.2 语音交互集成ini 体验AI代码助手 代码解读复制代码// 语音识别功能const recognition = new webkitSpeechRecognition
开箱即用！基于LangChain的企业知识库问答系统完整项目模板
data-value="0"></button>
14万字 | 400多道JavaScript 面试题及详细答案（建议收藏）
下面的例子展示了如何使用这个 API 从语音中获取文本， window.SpeechRecognition = window.webkitSpeechRecognition || window.SpeechRecognition ; // webkitSpeechRecognition for Chrome and SpeechRecognition for FF const recognition = new window.SpeechRecognition
Python Web 深度学习实用指南：第四部分
为此，请使用以下代码： $(document).ready(function(){ window.SpeechRecognition = window.webkitSpeechRecognition
