javascript - 如何使用移动浏览器进行无缝音频循环？

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 的媒体插件

• 创造差距。

网络音频

• 成功了!
• 对于 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

With HTML5 If you are using HTML5, then use loop attribute.

<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>

它不会产生间隙，请检查您的音频文件，大多数音频文件的末尾都有间隙。

可以测试一下here ，只需添加循环属性并运行页面即可。

With JavaScript

这里还有一个使用 javascript 的替代方法

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

这里 JavaScript 会产生很小的间隙，您可以通过在音频即将结束时而不是在音频结束时播放循环来克服它。这是代码。

Here is what you want.

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();

Here是演示。