微信H5中JSSDK 录音识别注意事项记录

微信H5中JSSDK 录音识别注意事项记录

问题一：长按按钮录制时，IOS 会触发文本复制功能

解决方案：在按钮的css上添加样式：user-select: none;

问题二：首次进入H5页面后调用wx.startRecord时会触发微信授权，可能会导致一直停留在录制界面

解决方案：建议在切换录音识别的按钮上触发一次wx.startRecord，并且立马调用wx.stopRecord
当然不需要每次都触发，主要当前用户未授权则需要触发，可以弄一个标记。
例如：

if (!localStorage.getItem('rainAllowRecord') || localStorage.getItem('rainAllowRecord') !== 'true') {wx.startRecord({success: function(){localStorage.setItem('rainAllowRecord', 'true');wx.stopRecord();},cancel: function () {alert('用户拒绝授权录音');}});
}

问题三：IOS有时候touchend事件不触发。

解决方案：将@touchcancel事件也加入进去。

- @touchStart="touchStart"
- @touchend="touchEnd"
- @touchcancel="touchEnd"

问题四：IOS 长按触发开始录制的瞬间松开触摸，可能导致touchend优先于wx.startRecord执行

原因：wx.startRecord函数是放到touchStart方法中执行的，wx.startRecord执行比较耗时，这时候触摸松开touchend可能就已经在执行了，会导致本次录音失败。
解决方案：在touchend方法执行第一行记录一个时间戳：touchEndTime=new Date().getTime();
当执行wx.startRecord成功后判断：new Date().getTime() - touchEndTime <600，如果为True则执行wx.stopRecord
参考代码：

let touchEndTime = null;
// 触摸结束方法
function touchEnd (){touchEndTime=new Date().getTime();...... 
}
wx.startRecord({success: function(){let now = new Date().getTime();if(touchEndTime && now - this.touchEndTime <600){wx.stopRecord()alert('录音时间过短。');}},cancel: function () {alert('用户拒绝授权录音');}
});
//