js / html5 audio：为什么在iOS Safari上没有触发canplaythrough？ [英] js / html5 audio: Why is canplaythrough not fired on iOS safari?

问题描述

我使用下面的代码预加载音频文件数组（在用户与启动过程的按钮交互后）。在所有音频文件触发canplaythrough后代码继续执行：

i use the code below to preload an array of audio files (after user interacts with a button starting the process). After all audio files fired "canplaythrough" the code proceeds:

var loaded = 0;
function loadedAudio() {
    // this will be called every time an audio file is loaded
    // we keep track of the loaded files vs the requested files
    loaded++;
    console.log(loaded + " audio files loaded!");
    if (loaded == audioFiles.length){
      // all have loaded
      main();
    }
}

function preloadsounds()
{
  $("#loader").show();
  console.log(level.config);
  audioFiles = level.config.soundfiles;

  // we start preloading all the audio files with html audio
  for (var i in audioFiles) {
      preloadAudio(audioFiles[i]);
  }

}

function preloadAudio(url)
{
  console.log("trying to preload "+ url);
  var audio = new Audio();
  // once this file loads, it will call loadedAudio()
  // the file will be kept by the browser as cache
  audio.addEventListener('canplaythrough', loadedAudio, false);

  audio.addEventListener('error', function failed(e)
  {
    console.log("COULD NOT LOAD AUDIO");
    $("#NETWORKERROR").show();
  });
  audio.src = url;
}

在Android（Chrome和Firefox）上效果很好，但没有一个canplaythrough事件是在iOs Safari上解雇（在5s实时测试并且模拟X均为11.x）。所有文件都来自同一个Origin。我的日志中也没有收到任何错误消息。

works great on Android (Chrome and Firefox) but not a single canplaythrough event is fired on iOs Safari (tested live on 5s and emulated X both 11.x). All files are served from the same Origin. I also don't get any Error messages in my log.

我缺少什么？

（以上代码的基础我来自：https://stackoverflow.com/a/31351186/2602592 ）

( the basis for the code above i go from: https://stackoverflow.com/a/31351186/2602592 )

推荐答案

尝试调用 src 后，nofollow noreferrer> load（） 方法。

Try calling the load() method after setting the src.

function preloadAudio(url)
{
  console.log("trying to preload "+ url);
  var audio = new Audio();
  // once this file loads, it will call loadedAudio()
  // the file will be kept by the browser as cache
  audio.addEventListener('canplaythrough', loadedAudio, false);

  audio.addEventListener('error', function failed(e)
  {
    console.log("COULD NOT LOAD AUDIO");
    $("#NETWORKERROR").show();
  });
  audio.src = url;

  audio.load();  // add this line
}

这篇关于js / html5 audio：为什么在iOS Safari上没有触发canplaythrough？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！