如何在第二次播放时停止Safari剪辑音频片段

Question

事实证明，当您使用javascript触发音频时。在最新版本的safari中，如果你使用obj.play()两次，第二次，音频部分会被切断(至少在mac上(。Chrome中不会出现此问题。仅在Safari上。

有人知道这方面的变通办法吗？

<a href="javascript:playWord()">Play</a>
<audio id="t" src="https://biblicaltext.com/audio/%e1%bc%a4.mp3"></audio>
<script>
function playWord(word) {
a = document.getElementById('t');
//a.currentTime = 0
a.play();
//a.src = a.src
}
</script>

https://jsfiddle.net/8fbt7rgc/1/

使用a.src = a.src重新下载文件是可行的，但并不理想。

Answer 1

这听起来像是一个应该让他们意识到的错误。

目前，如果您可以访问以相同或原始方式播放的文件，您可以使用Web Audio API及其AudioBufferSourceNode接口，以比HTMLMediaElements:更高的精度和更低的延迟播放媒体

(async () => {
const ctx = new (window.AudioContext || window.webkitAudioContext)();
// Using a different file because biblicaltext.com
// doesn't allow cross-origin requests
const data_buf = await fetch("https://dl.dropboxusercontent.com/s/agepbh2agnduknz/camera.mp3")
.then( resp => resp.arrayBuffer() );
const audio_buf = await ctx.decodeAudioData(data_buf);
document.querySelector("a").onclick = (evt) => {
evt.preventDefault();
const source = ctx.createBufferSource();
source.buffer = audio_buf;
source.connect(ctx.destination);
source.start(0);
}
})();

<!-- Promising decodeAudioData for old Safari https://github.com/mohayonao/promise-decode-audio-data/ [MIT] -->
<script src="https://cdn.rawgit.com/mohayonao/promise-decode-audio-data/eb4b1322/build/promise-decode-audio-data.min.js"></script>
<a href="#">Play</a>