1

我们使用 CreateJS 套件已经有一段时间了，但刚刚意识到我们的音频无法在 IOS9 上运行。不幸的是，我们只有一台运行 IOS9.2.4 的 IOS9 测试设备，但在音频播放方面的结果好坏参半。

我正在使用的粗略过程是；

  • 通过 PreloadJS 预加载所有资产（脚本/图像/音频）
  • 在 EaselJS 中构建初始启动画面，包括一个开始按钮
  • 继续主要内容

能够在呈现初始屏幕之前预加载所有音频将是有利的。最初添加的初始屏幕是为了允许在移动 Safari 上播放音频，单击时播放空声音。这当然适用于 IOS7/8，但不适用于 9。

我在 codepen 上创建了这个测试用例，试图追踪问题并尝试一些选项。

Codepen 示例

HTML

<p id="status">Hello World</p>
<canvas id="canvas" width="200" height="200"></canvas>

JS

var canvas, stage, rect;

function init() {
  canvas = document.getElementById('canvas');
  canvas.style.background = "rgb(10,10,30)";
  stage = new createjs.Stage("canvas");

  createjs.Touch.enable(stage);

  rect = new createjs.Shape();
  rect.graphics.f("#f00").dr(50,75,100, 50);
  rect.on("mousedown", handleStart, null, true);
  rect.on("touchend", handleStart, null, true);
  //rect.on("click", handleStart, null, true);
  stage.addChild(rect);
  stage.update();

  $('#status').text("Touch to Start");
  createjs.Sound.initializeDefaultPlugins();
  //createjs.Sound.alternateExtensions = ["ogg"];
  createjs.Sound.registerSound("https://www.freesound.org/data/previews/66/66136_606715-lq.mp3", "ding1");

}

function handleStart(event) {
  createjs.WebAudioPlugin.playEmptySound();

  $('#status').text("Touch to Play");

  rect.graphics._fill.style = '#0f0';
  rect.removeAllEventListeners();
  rect.on('click', handlePlay);
  stage.update();
}

function handlePlay(){
  createjs.Sound.play("ding1");
  $('#status').text("Playing");
}

init();

为缺少 ogg 版本而道歉，正在努力让测试文件加载 x-domain。

有了这个，音频在 IOS9 上部分为我们工作。如果我们离开单击红色矩形（图开始按钮）并保持约 20 秒，然后单击绿色按钮不播放音频。如果我们立即单击它，音频播放正常。

我一直在审查这个错误/线程并尝试遵循格兰特的建议。我收集 SoundJS v0.6.2 现在会在初始化插件时自动尝试播放适当的空声音，但是将 initializeDefaultPlugins 和 registerSounds 调用移动到 handleStart 函数中似乎没有任何区别。如果我正确理解了这个问题，调用WebAudioPlugin.playEmptySound方法就足够了吗？

也一直在看事件绑定，尝试mousedown/touchend而不是click，但结果和20秒的等待是一样的。事件似乎也触发了两次，但如果我能让它正常工作，我可能会更深入地研究它。

我知道针对此问题的Mobile Safe Approach文章，但在此级别需要命名空间意味着对我们现有内容的大量重写。有人可以建议是否完全有必要采用这种方法？我的印象是通过在初始处理程序中正确播放一些空音频应该是可行的。

实际上无法将主要项目做到这一点，但如果我能得到一个工作示例，也许我会更接近一步。

任何想法将不胜感激！

4

1 回答 1

3

自 0.6.2 更新以来，移动安全教程不再真正相关。它可能会在不久的将来更新或删除。

  • 你永远不需要initializeDefaultPlugins()，除非你想对结果采取行动（即，在做某事之前检查 activePlugin ）。当您第一次尝试注册声音时，此方法会自动触发。
  • playEmptySound也不再需要。SoundJS 将侦听第一个文档 mousedown/click，并在后台自动执行此操作。
  • 触摸事件不直接从 EaselJS 阶段传播，而是转为鼠标事件（touchstart=mousedown、touchmove=mousemove、touchend=pressup/click）

基于此，单击文档中的任何位置后，无论您是否收听，您都应该能够播放声音。

这并不是说没有错误，只是说您采取的步骤不应该是必要的。我做了一些测试，它似乎在 iOS9 中工作。这是一个简化的小提琴。 https://jsfiddle.net/lannymcnie/b4k19fwc/（链接更新于 2018 年 12 月 3 日）

于 2016-03-03T21:09:17.233 回答