如何在第二次播放时停止 Safari 剪辑部分时间的音频
How to stop Safari clipping fractions of time off audio on second play
事实证明,当您使用 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
重新下载文件有效,但并不理想。
这听起来像是一个错误,他们应该是 made aware of。
目前,如果您可以访问以同源方式播放的文件,则可以使用 Web Audio API and its 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>
事实证明,当您使用 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
重新下载文件有效,但并不理想。
这听起来像是一个错误,他们应该是 made aware of。
目前,如果您可以访问以同源方式播放的文件,则可以使用 Web Audio API and its 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>