当前位置：首页 » 编程语言 » 语音识别html5

语音识别html5

发布时间: 2021-03-18 03:14:45

① html5语音识别技术原理是什么可以很简单实现，但是具体原理是怎么样的

HTML5之语音识别实例
代码
<input type="text" x-webkit-speech id="d1" lang="zh-CN" x-webkit-grammar="bUIltin:search" onwebkitspeechchange="foo()"/>

<script>
function foo(){
var n = document.getElementById("d1").value;
if(n == "网络"){
window.location.href = "http://www..com";
}else{
window.location.href = "http://www.ahsdxy.ah.e.cn/";
}
}
</script>

说明：
1）x-webkit-speech：语音识别支持属性
<input type="text" x-webkit-speech/>
2）lang：设置语言种类，比如汉语:lang="ch-CN"
<input type="text" x-webkit-speech lang="ch-CN"/>
3） x-webkit-grammar ：语音输入语法
比如: x-webkit-grammar="bUIltin:search"使得语音输入的内容尽量靠近搜索内容，去除多余的字符，例如“的、啦”等
<input type="text" x-webkit-speech lang="ch-CN" x-webkit-grammar="bUIltin:search"/>
4） onwebkitspeechchange ：语音输入事件，当语音改变时触发
比如：onwebkitspeechchange="foo()" ，当停止语音时，会触发js中的foo()函数
<input type="text" x-webkit-speech lang="ch-CN" x-webkit-grammar="bUIltin:search"
onwebkitspeechchange="foo()"/>
此时，需要写相应的JavaScript函数foo()
<script>
func

② HTML5智能语音识别开关原理是什么可以很简单实现，但是具体原理是怎么样的

推荐使用YQ5969,这个智能语音识别开关可以支持本地和云端识别不同需求。5米内本地识别率 93%以上，云端识别率97%。YQ5969智能语音识别开关语言模型是用来计算一个句子出现概率的概率模型。它主要用于决定哪个词序列的可能性更大，或者在出现了几个词的情况下预测下一个即将出现的词语的内容。

③ Html5语音识别DEMO无法使用求助

目前只有Chrome 11及以上版本才支持。
可以用chrome浏览器试试效果
还有360极速浏览器也支持
IE10，火狐，WebKit内核浏览器目前也都不支持

④ 我想在网页实现语音输入，查了一下可以用html5与chrome浏览器，

<inputx-webkit-speechlang="zh-CN"x-webkit-grammar="builtin:search"type="search">

⑤ HTML5语音识别原理是什么可以很简单实现，但是具体原理是怎么样的

一、应用

HTML5语音识别（现在一般用在搜索上），目前相关介绍还是挺多的。为何呢？因为很简单！

下面是个普通文本框：

<input />

而稍稍多敲几个字母，其就变成了支持HTML5语音API的语音识别文本框了。

<input x-webkit-speech />

我不喜欢嚼人家的烂根子，但是，就算闹得再轰轰烈烈，那些种田的农民伯伯也不知道“半13 连体裤”为何物。因此，一想到如此简单实用的装逼功能还有不少人并不熟知，我这心里啊，就觉得不踏实。

你想想看哪？一说语音识别，哇靠，外行人(比方说你受尽脸色的产品经理或是老板之类)一听，立马觉得这玩意牛逼哄哄。但是，你却搞出来了，OK，这下可以尽情装逼了：老板那，昨儿个我放弃和女友啵啵的好机会，埋头苦干，加班加点攻克语音识别这个史无前例的技术难关，皇天不负有心人，终于让我拿下啦！！

必然的，什么刮目相看，滔滔江水敬仰之情都来了。因此，HTML5语言识别就是每个前端人员都必备的装B神器。

装B模式启动

自从有了HTML5语音识别，老板再也不用担心网站不高级了，so easy!

HTML5 语音识别网站高级 so easy
二、庐山小面目

纸上得来终觉浅，绝知此事要躬行。因此，有必要大家都来试试这装B神器。如果您手头上有活正在使用的是Chrome 11+浏览器，您可以狠狠地点击这里：HTML5语音识别功能demo

看到没，文本框后面有个麦克风模样的东西，我们满怀崇敬之情点击之，突然眼前亮光一闪，(//zxx:不是亮瞎了金钛狗眼)，神器出现了：
神器降临张鑫旭-鑫空间-鑫生活

此时，对着音频输入设备（如耳麦）发出你那或妖娆，或醇厚，或磁性的嗓音，啊~~

于是，神器显威，樯橹吹灰：
模仿大S说话
语言识别结果

如果网速不行，或是google被墙了，或是你长时间不说话，或是说得是鸟语，神器可能就会不高兴，然后这样：
长时间不说话，神器不开心
或者是这样：
说鸟语神器不开心

当然，这里的语言识别还有其他参数或是方法。
比方说表示语言的：

<input x-webkit-speech lang="zh-CN" />

以及表示语法的（据说bUIltin:search可以过滤助词，不过我没测试过）：

<input x-webkit-speech x-webkit-grammar="bUIltin:search" />

还有一个onwebkitspeechchange的方法，发生在语言识别成功，且文字输入到文本框后触发。

input.onwebkitspeechchange = function() {
// ...
};

三、神器的不足

人无完人，金无足赤。虽说HTML5语言是被是前端开发人员装B神器，但是，并不是每次都装得很perfect的。什么时候会掉水沟呢？我目前知道的有两种情况：
1. iframe中定位问题
如果语音识别框在iframe中，则，神器定位似乎出现了偏差——相对于父级上下文容器定位了。//zxx:因为HTML5不鸟iframe了？

您可以狠狠地点击这里：iframe中语音识别框定位不准demo

iframe下语音框很错位demo

2. 语言内容累加的问题
在正常情况下，点击语音那个小图标，输入框中的文字还是处于选中状态的，于是，新的语言信息会覆盖之前的文字。但是，如果这种选中状态丢失，就是出现语音识别内容不断累加的bug.

您可以狠狠地点击这里：语音识别累加bug实例

例如，我们第一次说，”yu yin sou suo”，出现的是：
第一次语音搜索可以识别张鑫旭-鑫空间-鑫生活

但是，要是你继续说，”yu yin shi bie”，则出现的不是“语音识别”，而是“语音搜索语音识别”，两者累加了，而不是覆盖。这种情况再本文第一个demo中是不会出现的。
语音搜索内容累加bug展示

为何，这个demo做了个很小的事情，就是在文本框（搜索框）失去焦点的时候，值重新赋了下。——因为文本框重新赋值会去掉文字选中状态，然后……

还是不明白？静下心，多花几分钟想想，会明白的。
四、要不，在说点什么

文章标题有两个字，“渐进”，应该都懂什么意思。别跟我整什么“IE6不支持”有的没的的，不支持就不支持，又不是没有基本生活保障。目前，就Chrome 11+浏览器上有该功能。

考虑到低级变高级的成本实在是低，而且基本上对之前的基本功能没有任何影响。因此，我觉得所有网站所有的类似搜索的输入框都让他支持HTML5语言识别吧！想想这是你装逼翻身的好机会，就果断去做了吧！！

⑥ 如何实现HTML5语音识别功能

⑦ HTML5语音识别遥控器原理是什么可以很简单实现，但是具体原理是怎么样的

推荐使用YQ5969,这个语音识别遥控器可以支持本地和云端识别不同需求。5米内本地识别率 93%以上，云端识别率97%。YQ5969语音识别遥控器语言模型是用来计算一个句子出现概率的概率模型。它主要用于决定哪个词序列的可能性更大，或者在出现了几个词的情况下预测下一个即将出现的词语的内容。

⑧ 为什么我做的html5语音识别不能成功

请确保你的浏览器版本不是老版本，我的是ie10测试没问题，包含几个主流浏览器都没问题

⑨ 谷歌浏览器怎样设置支持html5语音输入

实现语音来输入
<input type="text" x-webkit-speech />
只要在input元素上加上源x-webkit-speech属性就可以了。如果你用的是xhtml，那么就需要这样写x-webkit-speech="x-webkit-speech";
lang 说明语音识别的语言种类
<input type="text" x-webkit-speech lang="zh-CN" />
x-webkit-grammar 精确语音内容，如果是用搜索可以自动去掉 “的”之类的字
<input type="text" x-webkit-speech x-webkit-grammar="bUIltin:search" />
onwebkitspeechchange事件，即语音发生变化时触发的事件，一般可以作为提交
<input type="text" x-webkit-speech onwebkitspeechchange="$(this).closest('form').submit()"/>

阅读全文

语音识别html5

与语音识别html5相关的阅读推荐