Android 长按录音之伤

最近在微信上实现一个长按录音功能, 即在用户按下时调用微信 JS-SDK 录音接口, 然后在用户松开时停止录音.
很简单吧, 呵呵呵~
你脑海中可能已经浮现出如下代码
* touchstart -> wx.startRecord
* touchend -> wx.stopRecord
这种小 case 不就是几句代码的事情吗, 我还有必要写一遍文章出来刷存在感吗?
其实我也不想啊, 主要是测试时神奇地发现 Android 上死活不能停止录音, 没办法了, 只好一步步确定问题, 以下叨了叨只为纪念我因此逝去的光阴.
分析
=========
想法: 实现类似微信那样长按(touchstart)开始录音, 松开后(touchend)停止录音的功能
症状: 浏览器没有触发 touchend 事件, 因此没有办法结束录音
异常表现
* 当 touchstart 时调用了 wx.startRecord, 触发的事件为: touchstart -> touchcancel(此时还未松开手指)
* 当 touchstart 时不调用 wx.startRecord, 触发的事件为: touchstart -> touchend(松开手指后)
PS: 如果只是迅速的按一下就松开(tap 事件), 触发的事件为: touchstart -> touchend
因此只有长按时才会有这个问题.
测试过存在这个问题的手机
* MI 1S(Android 4.1.2) 微信 6.3.15
* HUAWEI G750-T20(Android 4.4.2) 微信 6.3.16
重现问题的测试页面 android-wx-startrecord-no-touchend.html
结论
=========
在 Android 微信上 touchstart 时调用 wx.startRecord 会导致不会触发 touchend 事件.
解决方案
=========
由于 Android 上通过 touchstart 调用了 startRecord 后会立即触发元素的 touchcancel 事件, 继而造成 touchend 事件就不触发了, 这个是硬伤(尝试过后无法绕过解决), 因此没有办法实现长按录音, 松手后结束录音这个功能, 只好让用户再(在 document 上)随便点击一下就结束录音好了.
这样做还可以避免第一次授权时, 有一个弹出确认框也会造成 touchend 事件不触发.
PS: iOS(测试过 iPhone5 iOS 7.0.6)上没有这个问题
    在浏览器上测试时发现, 长按时右键菜单被激活, 也会直接触发元素的 touchcancel 事件而导致 touchend 事件不被触发
参考
=========
* 微信JSSDK与录音相关的坑
* 想要实现类似微信的按下录音功能所有用到touch事件代码如下