让你的网页拥有语音识别输入功能（chrome浏览器）

最新推荐文章于 2024-05-23 14:08:44 发布
最新推荐文章于 2024-05-23 14:08:44 发布
阅读量1.3k 收藏 2
点赞数
文章标签： 人工智能

chrome浏览器的标签法

只要在你的输入框加入x-webkit-speech 参数即可让你的页面具有语音识别输入功能。

html代码：

<input type="text" name="inputBox" id="inputBox" x-webkit-speech /> 

weixin_33901641
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
HTML是一种标识语音,HTML实现网页端语音输入（语音识别，语义理解，olami）
weixin_35988065的博客
05-30 1524
olami开放平台sdk除了支持语音识别功能外，更强大的在于支持语义理解功能，在Android平台和iOS平台都有示例demo供大家下载。在web端，基于JavaScript用olami开放平台sdk也可以实现语音识别语义理解。本文就实现了这样一个小程序，web客户端本地用麦克风录音，录音的数据用speex压缩，然后跨域向服务器发送请求，返回识别的语音和语义字符串并显示。先上图：如下图刚载入的时候...
ngx-speech-recognition：Angular 5+语音识别服务（基于浏览器实现，例如Chrome）
01-31
Angular 5+语音识别服务（基于Chrome等浏览器的实现）。 演示版 为演示服务器运行ng serve 。 导航到http://localhost:4200/ 。 如果您更改任何源文件，该应用程序将自动重新加载。 看到 API ...
html 语音识别
04-01
html 在线语音识别，直接可用，仅供学习，禁止商业用途，如需商业请寻找科大讯飞合作谢谢。
Chrome 浏览器自带声音转文字 实时字幕功能
最新发布
TOPSTIP的博客
05-23 714
分享一个 Chrome 浏览器的实时字幕功能，你在浏览器里听到的声音可以自动显示字幕，方便听一些英语直播，还能实时翻译成中文（简体），中文（繁体），法语，德语，印地语，印尼语，意大利语，日语，韩语，波兰语，葡萄牙语，西班牙语，泰语，土耳其语，大家可以试下。
X-WEBKIT-SPEECH 语音输入功能
简单爱你所爱、世界也变得大了起来
10-24 2524
X-WEBKIT-SPEECH 语音输入功能 现在各大网站都在搜索框中加入了语音输入功能，不过目前只有Chrome 11及以上版本才支持。 可以用chrome浏览器在这里试试效果，点击话筒即可： 实现起来也非常简单，为input添加名为 x-webkit-speech 的属性就行了。 x-webkit-speech /> 相关的属性设置： lang 设置语
html5为输入框添加语音输入功能
suyuwen1的专栏
01-07 2783
这里介绍的是大家以后要用到的html强大功能，可直接给输入框增加语音功能，下面我们先来看看实现方法。 大家可以看到在输入框右边的麦克风图标，点击麦克风就能够进行语音识别了 其实很简单，语音识别是html5的基本功能，它的用法是 如果喜欢XHTML类似的语法，可以这样表示 语音识别在十年前是让人觉得不可思议的事情，即便是前些年，网页上的语音识别也只能使用其他方
支持语音输入的文本框(x-webkit-speech)
三寿的专栏
04-09 1877
相信大家现在在浏览网页时都不难看到一些网站的文本框中带有一个话筒(点击话筒可以语音输入内容到文本框中)，下面给大家介绍如何使自己的网站也支持语音输入内容。 现在各大网站都在搜索框中加入了语音输入功能，不过目前只有Chrome 11及以上版本才支持。可以用chrome浏览器在这里试试效果，点击话筒即可： 实现起来也非常简单，为input添加名为 x-webkit-speech 的属性就行
speech-recognition-toolkit:Chrome浏览器的语音控制
05-14
语音识别工具包是一个扩展程序，可以帮助您将语音转换为文本，并在网站上填写表格，并根据需要说出可识别的文本。 它可以识别多种语言。 为了使用此扩展程序，只需打开插件的用户界面，然后按大麦克风图标即可开始...
浅析如何利用JavaScript进行语音识别
10-21
所谓语音识别就是将你所说的转化成文字。Chrome 浏览器在版本25之后开始对这一特性的支持。这篇文章将会详细的介绍如何使用JavaScript进行语音识别，感兴趣的朋友们可以参考借鉴，下面来一起看看吧。
Tripsis.SpeechMap:使用 Chrome 语音识别的语音控制映射
06-27
Tripsis.SpeechMap是一款创新的应用，它利用了Chrome浏览器内置的语音识别功能，实现了一种独特的语音控制地图导航方式。这款应用旨在提供一种更为便捷、直观的交互体验，让用户可以通过自然语言与地图进行互动，...
HTML5为输入框添加语音输入功能的实现方法
11-21
这里介绍的是大家以后要用到的html强大功能，可直接给输入框增加语音功能，下面我们先来看看实现方法。 大家可以看到在输入框右边的麦克风图标，点击麦克风就能够进行语音识别了。 其实很简单，语音识别是html5的基本功能，它的用法是 <input type=”text” speech x-webkit-speech /> 如果喜欢XHTML类似的语法，可以这样表示 <input type=”text” x-webkit-speech=”x-webkit-speech” /> 语音识别在十年前是让人觉得不可思议的事情，即便是前些年，网页上的语音识别也只能使用其他方式实现，比如使用Flashplay
微软语音识别网页版demo
11-12
微软必应语音识别官方网页版 demo 需要注册appkey，利用网页调用麦克风获得声音文件上传，并返回文字信息。
html5 语音输入功能
tom2cjp的专栏
02-08 140
测试： html5的语音输入功能 支持： webkit核心的浏览器 Demo：
Golang 基于chrome浏览器语音识别web演示系统WebHTK开发之 UI篇
weixin_34354945的博客
03-04 293
没啥好说的，直接上现阶段的HTML代码，后续修改，再更新该篇博客。 record.html：<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> ...
HTML5网页语音识别功能演示
q6q6q的专栏
10-27 387
CSS语言：CSSSCSS确定*,*:before,*:after,ul,li,a,button,input,h1,h2,h3,h4,h5,h6,p,img,image,svg,path,g,canvas {margin: 0;padding: 0;box-sizing: border-box;background-color: transparent;border: none;text-deco...
python--基于百度aip的语音交互及语音唤醒
weixin_63032791的博客
10-23 4139
1.获得音频文件----->2.识别音频文件----->3.将音频文件转换为字符串------>4.进行其他相关操作（打开网址，语音对话，指挥机器人.....）背景：当前随着人工智能的快速发展，人机交互的热度变得越来越大，作为人机交互的很重要的一部分-----语音交互，逐渐成为当前的热门论点。这里是通过将百度aip转化后，返回的字典中，将键‘result’对应的值提取出来，然后将其转化为字符串。dev-pid:对应的是不同语言的识别，这里可以去参考百度文档，找出自己需要的语言转换。准备阶段,导入相关的库。
html谷歌浏览器实现自动播报语音,vue中解决chrome浏览器自动播放音频 和MP3语音打包到线上...
05-25
1. 谷歌浏览器实现自动播报语音 要实现自动播放语音，需要使用Web Speech API。这个API提供了两种语音合成的方式：SpeechSynthesis和SpeechRecognition。 SpeechSynthesis是用来合成语音的，而SpeechRecognition则用来识别用户的语音输入。在这里，我们只关注SpeechSynthesis。 下面是一个简单的例子，演示如何使用SpeechSynthesis API来合成语音： ```javascript var msg = new SpeechSynthesisUtterance(); msg.text = "Hello, world!"; // 要合成的文本 window.speechSynthesis.speak(msg); // 开始合成语音 ``` 2. Vue中解决Chrome浏览器自动播放音频 在Chrome浏览器中，为了避免页面加载时自动播放音频，浏览器会默认禁用自动播放。这对于一些需要自动播放音频的应用来说是一个问题。 为了解决这个问题，可以使用一个叫做“用户交互事件”的方法。当用户在页面上触发了某些事件（比如点击、滚动等），就可以认为用户已经与页面进行了交互，从而可以自动播放音频。 在Vue中，可以将自动播放音频的代码放在mounted()方法中，这样当组件挂载到页面上时，就会自动播放音频： ```javascript mounted() { var audio = new Audio('path/to/audio.mp3'); audio.play(); } ``` 3. MP3语音打包到线上 要将MP3语音打包到线上，可以使用webpack中的file-loader插件。这个插件会将指定的文件复制到输出目录，并生成一个对应的URL。 首先，在webpack.config.js中配置file-loader： ```javascript module.exports = { module: { rules: [ { test: /\.mp3$/, use: [ { loader: 'file-loader', options: { name: '[name].[ext]', outputPath: 'audio/' } } ] } ] } } ``` 上面的配置会将所有后缀为.mp3的文件复制到outputPath指定的目录下，并生成一个对应的URL。 然后，在Vue组件中，可以使用这个URL来播放音频： ```javascript mounted() { var audio = new Audio('audio/audio.mp3'); audio.play(); } ``` 这样就可以将MP3语音打包到线上了。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值