移动端H5音频播放兼容

Audio 标签属性: 设置 preload="auto"

设置 currentTime

移动端IOS在设置currentTime 时，会存在异常。具体来说，只有在音频可播放时，才能设置时间。
而可播放的判断则是监听canplay事件，该事件的触发在ios和安卓上也有所区分，安卓是页面一加载就触发，ios是play播放之后触发。这给我们写代码造成了不小的麻烦。所以我采用以下办法：

/**
 * ios/安卓音频设置音频开始时间兼容处理,ios要play之后才能设置
 * @param {Element} audio 音频dom
 * @param {Number} time 时间
 * @param {Number} timeout 播放超时时间，默认10s
 */
function setCurrentTimePromise(audio, time) {
  if (!audio) return
  const isCanplay = audio.readyState === 4
  return new Promise(function(resolve, reject) {
    if (!isCanplay) {
      audio.addEventListener('canplay', function() {
        // 设置播放时间
        resolve(audio.currentTime)
        audio.currentTime = time
      })
    } else {
      resolve(audio.currentTime)
      audio.currentTime = time
    }
  })
}

这是一个返回promise的异步函数，可用于等待设置时间后再触发（未处理reject）。原理是根据audio.readyState的状态来判断音频是否可以播放。
实际使用过程中，我注意到，ios下会等待的时间比较长，大约0.5s～1.5s左右，跟网络有关。