小程序实现语音识别歌曲的功能,对接讯飞的api,踩坑篇!!
最近公司要求在小程序里实现识别搜索歌曲的功能,然后对接的是讯飞的api,本来我一个做前端的,对接第三方的文档这些应该留给后端做才对的,前端就上传一个录音给后端让他去调接口返回数据给我就好了。可是当我对接完之后发现其实这个由前端来对接还是比较好的,至少对服务器的压力没那么大。就是可怜我踩了三四天的坑,不过毕竟也是第一次接,而且也没有demo,所以接起来有点蓝廋!!!
好了开始我的踩坑之旅吧!!先奉上讯飞的文档
首先先说我碰到的坑吧:
1.json转成base64:一开始有点不懂json怎么转成base64啊?然后去查了一下小程序好像也没有提供什么方法,后来就在网上找了一个方法搬过来用了,就是先把json转字符串后再转base64。
2.就是X-Param里面的audio_url参数,一开始傻傻的把本地的临时地址放上去了,然后想了一下,讯飞怎可能拿得啊!然后就随便录了一个放上去七牛那里了,然后拿到地址放进去,还是不行,后来看了一下原来是我录音得格式那些错了。一开始百度了一下,看到上面很多人说小程序的录音现在还不支持pcm、wav这些格式的,后来用了**wx.getRecorderManager()**发现很多格式都支持了,看了更新日志才知道是今年才开始支持这些格式的。然后录音的时候就按照讯飞的要求去录音就好了。
3.后来想想要是我要上传七牛的话,还要调后端接口获取上传凭证(token)那还不如叫后端接算了,然后看到文档那里写着可以传二进制数据,然后我又百思不得其解了,小程序怎么获取录音的二进制数据啊?然后我就看了一下一遍wx.getRecorderManager()里的所有方法,然后找到了这个RecorderManager.onFrameRecorded()里面有个属性frameBuffer,这个属性的类型是ArrayBuffer(录音分片数据),然后问了一下朋友,这个就是二进制的数据,但是这个需要录音的时候定义属性frameSize才会有回调RecorderManager.onFrameRecorded()。然后直接拿到数据放在data里传过去就好了。
有点搞不懂上面图里为什么说仅支持MP3,其他格式也是可以的啊!不知道是不是微信忘改了还是怎样。具体我就不管了,反正我的问题可以就行。
4.最后再说一个搞笑的坑,前面的都做好了,然后工具里是录不了音的,我就改用真机调试了,然后就发现真机调试有坑,老是显示未连接。具体我也发了问题到微信开放社区那里了问题链接后来我就改用预览,然后发现不行,为什么真机跟工具都可以请求,为什么预览不行呢?后来才发现自己忘记再小程序平台配置讯飞的域名了。配置好了以后就啥问题都解决了!
说了一大堆的废话,最重要的还是结果!案例奉上demo:https://github.com/lzhihao04/xunfei.git
欢迎评论与提问!互相交流!
小程序实现语音识别歌曲的功能,对接讯飞的api,踩坑篇!!相关推荐
- 微信小程序实现语音识别功能
原标题:微信小程序实现语音识别功能 使用小程序实现语音识别功能,由于语音识别可以直接使用各厂家的API接口,并且小程序为腾讯所有,因此考虑到可能的低延时,采用了腾讯提供的免费API接口,准确讲是腾讯语 ...
- 微信小程序语音识别java_微信小程序实现语音识别功能
原标题:微信小程序实现语音识别功能 使用小程序实现语音识别功能,由于语音识别可以直接使用各厂家的API接口,并且小程序为腾讯所有,因此考虑到可能的低延时,采用了腾讯提供的免费API接口,准确讲是腾讯语 ...
- 微信小程序--实时语音识别
小程序实时语音识别 说到搜索功能,常见的有:图片搜索,语音搜索,文字搜索(模糊.精准) 今天我们聊聊如何在微信小程序上实现语音搜索,这里我们借助了第三方腾讯云智能语音插件 接下来让我们一起来看看实际操 ...
- 游戏开发需要具备哪些技术_小程序商城开发具备哪些功能?
小程序商城开发具备哪些功能?河南互金网络科技有限公司业务范围包括:软件开发.app开发.微信开发.网站建设.微信小程序开发等.在网站开发.APP开发.ERP以及大型软件开发方面积累了丰富的项目经验和技 ...
- 微信小程序 - 实现左滑动删除功能
微信小程序 - 实现左滑动删除功能 效果图: 实现过程: 一.wxml布局 这里我是先用了一个大盒子包裹小盒子,然后小盒子里面进行左右布局(左边为内容部分,右边为删除按钮)的方式实现的 <vie ...
- 微信小程序购物车 数量加减功能
微信小程序购物车 数量加减功能 wxml <!-- 主容器 --> <view class="stepper"> <!-- 减号 --> < ...
- 微信小程序的搜索和重置功能
微信小程序的搜索和重置功能 wxml <template><div><div class="input-wrap"><el-inputse ...
- 2行代码实现小程序分享到朋友圈功能
期盼已久的小程序直接分享到朋友圈的功能,官方终于支持了.今天就来带大家实现小程序分享到朋友圈的功能.代码很简单. 老规矩,以图为证 新加分享到朋友圈的按钮 分享到朋友圈的效果 分享成功 打开朋友圈分享 ...
- 小程序分享到朋友圈功能_来啦!小程序支持分享朋友圈
上线4年后的小程序,终于能发朋友圈了. 这应该小程序开发者最期待的功能之一. 小程序的推广渠道本来就少,没有链接,没有消息,不在微信和通讯录列表. 在此前,更没有机会获得朋友圈的展示. 作为一个日活近 ...
最新文章
- Android 开发工具类 36_ getSimSerial
- 【pytorch】model.train和model.eval用法及区别详解
- 解决360等等浏览器兼容模式解析不兼容代码
- 老笔记整理四:字符串的完美度
- DropBox 超实用的免费文件网络同步、备份、分享工具
- PYTHON知识梳理
- LeetCode-978:最长湍流子数组
- 【算法笔记】B1015 德才论
- 安全测试===Mysql 注入练习网站(3)
- javascript widget ui mvc
- bluecam连接步骤说明_智能门锁安装步骤分享
- 嘻游记 QVOD快播高清电影在线播放下载
- CAD技巧—教你快速查看CAD文件信息和文件版本
- python入门汇总
- WinDbg分析蓝屏dump原因
- 2020年的5种常见骇客行为,你的电脑安全吗?
- 【5G核心网】5GC核心网之网元NSSF
- 数据链路层——局域网扩展
- 【5GC】什么是5G切片?5G切片如何工作?
- 计算球体积和球表面积