如何使用移动浏览器进行无间隙音频循环？

Question

看来我无法通过移动实现无间隙循环.这是我到目前为止所做的:

https://github.com/Hivenfour/SeamlessLoop

• 创造差距.

http://www.schillmania.com/projects/soundmanager2/demo/api/

• 创造差距.

https://github.com/regosen/Gapless-5

• 创造差距.
• 下载相同的音频两次.

https://github.com/floatinghotpot/cordova-plugin-nativeaudio

• 创造差距.

HTML5音频

• 创造差距.

Cordova的媒体插件

• 创造差距.

WebAudio

• 作品!
• 对于1.5分钟的音频剪辑,解码时间> 30秒.
• https://code.google.com/p/chromium/issues/detail?id=424174

以上所有测试都使用mp3和ogg.

编辑:

SoundJS的cordova插件坏了,因此不起作用;

https://github.com/CreateJS/SoundJS/issues/170

Answer 1

使用HTML5如果您使用的是HTML5,请使用循环属性.

<audio controls loop>
  <source src="horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

它不会产生间隙,请检查您的音频文件,大多数音频文件最后都有差距.

你可以在这里测试它,只需添加循环属性并运行页面.

使用JavaScript

这里也是使用javascript的替代方案

myAudio = new Audio('someSound.ogg'); 
myAudio.addEventListener('ended', function() {
    this.currentTime = 0;
    this.play();
}, false);
myAudio.play();

在这里,JavaScript会产生很小的差距,你可以通过播放循环来克服它,而不是在音频完成时但音频即将完成时.这是代码.

这就是你想要的.

myAudio = new Audio('http://unska.com/audio/pinknoise.ogg'); 
myAudio.ontimeupdate= function(i) {
  if((this.currentTime / this.duration)>0.9){
    this.currentTime = 0;
    this.play();
  }
};
myAudio.play();

这是Demo.