开发者社区> 烟海之蓝> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

微信JSSDK录音功能开发遇到的坑

简介: 1、在进行微信网页录音功能开发的时候,微信jssdk初始化一定要把用到的方法写在isApiList中,不然调用方法起不到效果。 2、微信录音前会弹出“是否允许录音”,点击是才会执行wx.startRecord函数success回调,否则执行fail。所有,要把微信录音中的动作写在succe
+关注继续查看

1、在进行微信网页录音功能开发的时候,微信jssdk初始化一定要把用到的方法写在wx.config配置信息jsApiList中,不然调用方法起不到效果。


jsApiList: ['onMenuShareAppMessage','translateVoice','onVoiceRecordEnd','stopVoice'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2

2、微信录音前会弹出“是否允许录音”,点击是才会执行wx.startRecord函数success回调,否则执行fail。所以,要把微信录音过程中相关的动作写在success回调里。**这个‘是否允许录音’提示很没有规律,在开始调试的时候很正常,只有在第一次录音和一定时间之后(这个时间没有找到规律到底是多长)弹出提示;不正常的是有段时间,微信每次都会弹出这个提示,并且在有些手机上会卡住,必须点击返回才能正常录音。

3、微信录音到60秒时会出现不执行wx.uploadVoice的bug,导致音频获取不到,解决方法是在录音到59秒的时候停止录音。微信有一个到60秒自动停止的方法,碰到的问题是进入这个方法,到60秒会自动停止,但不会执行后面的上传语音的逻辑,只是把录音停止了,写的其他动作都没执行。

wx.onVoiceRecordEnd({
    // 录音时间超过一分钟没有停止的时候会执行 complete 回调
    complete: function (res) {
        var localId = res.localId; 
    }
});


4、微信录音后会返回本地音频地址,可以用wx.playVoice直接播放,上传数据时则要用wx.uploadVoice获取mediaId后上传这个数据,本地音频地址是不能上传的。等播放的时候用wx.downVoice以mediaId为参数再下载到本地播放本地音频文件。微信只会保留3天,3天过后mediaID就会失效,所以在3天内要把资源下载到自己的服务器中。

5、连续播放微信本地音频:录音之后会直接得到本地音频地址,可以用来直接播放,所以在录音页面连续播放音频时,会少一个下载音频的逻辑。如果进行连续点击音频进行播放,会导致微信方法崩溃掉,所以要加一个统一开关使音频回归到初始状态,这样再次点击时,就不会出现bug。注意:这个回归到初始化的方法要用wx.stopVoice方法。再连续播放时是自动进行的,所以这个地方也要加一个初始化操作。就是在播放每一个音频之前都加一个初始化操作,这个地方ios和Android处理方法不一样,ios要用wx.pauseVoice方法,Android要用wx.stopVoice才可以。

6、连续播放微信mediaID音频文件:在播放之前要用wx.downLoadVoice下载到本地,然后播放本地音频文件,这个地方用到了异步获取资源的操作了,这个时候在初始化时不能用遍历所有音频文件进行停止操作,需要在停止前进行判断,找出正在播放的进行停止。

7、连续播放自己服务器音频文件:这个时候用到audio标签播放,需要异步获取音频地址,所以不能再页面初始化的时候进行获取,会导致获取的结果顺序乱掉,需要在点击音频的时候在获取当前音频的url。这个时候会出现audio在某些手机上不能播放的兼容问题,就是audio地址如果是异步获取的,在第一次的时候播放不出来。解决方法是在页面中写入一个audio标签,src中放入一个时长1s的音频,在点击的时候就播放,然后异步获取音频url再进行替换。注意:ios是没有这个bug的,所以ios是不能用这个方法,如果用了就会出现bug。

8、监听audio音频播放停止事件,用到了audio标签的ended属性,如果停止了返回true。给audio标签添加监听事件,这个时候用于连续播放功能的记录顺序的下标要用全局变量。


**其他网友遇总结的问题地址:http://www.henkuai.com/thread-11227-1-1.html

058600a2a949d23567e827d2d60e226c87fc8f88


版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
Vue.js - 单页面 SPA ,IOS 端页面跳转后调用微信 JSSDK 时报错: "invalid signature" 解决方案
Vue.js - 单页面 SPA ,IOS 端页面跳转后调用微信 JSSDK 时报错: "invalid signature" 解决方案
0 0
ASP.NET MVC做的微信WEBAPP中调用微信JSSDK扫一扫
今天做一个项目,是在微信上用的,微信WEB APP,里面用到了调用手机摄像头扫一扫二维码的功能,记得以前某个项目里写有的,但是找不到之前那个项目源码了,想复制粘贴也复制不了了,只好对着微信的那个开发文档重新再写过 ,顺便写个博客,以后碰到相同的问题直接复制博客里的代码就行了 以下是显示在微信上的页...
1408 0
前端工程师如何快速的开发一个微信JSSDK应用
亲们,订阅号出来已经很久了,作为一个前端工程师或者全栈工程师,你是不是错过了什么?大概许多攻城狮同砚还没有反应过来订阅号怎么回事,就马上要被微信的应用号秀一脸了。在应用号还没有正式出来之前,我们赶紧一起来看看怎样给自己的订阅号加个网页功效吧。 一、订阅号网页与平凡的HTML5网页的区别 可能会有很多同学还没有弄清楚普通的HTML网页与订阅号网页的差别,我在这里简朴的说明一下。 订阅号的网页就
1853 0
微信JSSDK多图片上传并且解决IOS系统上传一直加载的问题
微信多图片上传必须挨个上传,也就是不能并行,得串行: 那么我们可以定义一个如下所示的上传函数: var serverIds = []; function uploadImages(localImagesIds) { if (localImagesIds.
1215 0
微信JSSDK接口,previewImage
原文:https://www.hackhp.com/801.html    在微信里看过文章的应该知道,文章里的图片点击后可以放大、分享和保存。 然而自己在微信里开发的网页,里面的图片点击后没办法实现这个效果,然后就去看了下微信JS文档,里面有个previewImage可以调用。
1118 0
用云开发搭建的微信答题小程序v1.0
用云开发搭建的微信答题小程序v1.0
0 0
unicloud云函数开发微信客服消息自动回复图片消息(完整步骤)
unicloud云函数开发微信客服消息自动回复图片消息(完整步骤)
0 0
微信点餐系统的开发与实现
   随着互联网技术逐渐的深入到生活,人们的生活消费习惯,已经发生很大的变化。就餐厅用餐而言,互联网技术和移动互联网技术的应用也己相关普及,比如早几年前就出现的餐厅点餐系统,就通过信息化的技术手段代替原来纸质菜单点餐的传统方式。这种方式一是可以方便顾客实现点餐叫号,二是方便商家进行人单合一的统一管理,减少了报单出错率,提升了用户的体验,所以得以大面积的应用和普及。        而移动互联网的出现,让智能手机的赋能更大广泛,腾讯微信适时推出微信小程序,使得智能手机的用户可以通过微信进行相应的信息化管理和参与,比如目前大面积应用的小程序商城,就将商业的业态从传统的PC互联网直接植入手机移动互
0 0
+关注
烟海之蓝
程序设计之道,无远弗界,御晨风而返
文章
问答
文章排行榜
最热
最新
相关电子书
更多
微信PaxosStore简介
立即下载
微信移动客户端数据存储优化实践
立即下载
微信广告引擎与播放节奏算法实践
立即下载