HTML5 MP3 <audio> 无法正确加载

Question

好的， 我的新网站刚刚上线，通过Google Apps交付。 百思不得其解，我决定添加一个javascript / HTML5 Lunar Lander克隆（Martian Lander），这是我前一段时间编写的练习。 当我在本地打开游戏时，它运行良好，但是当通过GAE交付游戏时，声音似乎并没有加载到每个系统上。 在移动浏览器中， 没有一个加载。 在桌面上的safari中，它们都可以可靠地加载到我的计算机上，而不是其他某些计​​算机上。 在Chrome（台式机）上似乎可以正常工作，但在iOS的Chrome中，只有一种声音可以加载。 在桌面上，它似乎总是无法加载的声音（ explode1.mp3 ），这是我正在加载的最小声音。 如您所见，如果单击该链接，则声音可以从服务器上很好地下载...

起初，问题似乎与大小写敏感有关，因此我在文件名中切换了大小写，但是该修复无法正常工作。 这是一个问题，因为我的加载栏与已加载的资源数量直接相关，因此它只是坐在那里等待GET请求而没有回复...有没有人遇到过类似的情况，其中GET在特定资源，但是直接加载资源可以正常工作吗？

我应该说，我对大多数这些技术都是新手，所以对我来说，我很可能刚刚犯了一些新手错误。 不幸的是，由于我是新手，因此我不确定这些新手错误是什么！

这是我用来加载声音的代码：

function loadSound(soundName) {
    var newElement = document.createElement("audio");
    newElement.addEventListener("canplaythrough", assetLoaded, false);
    document.body.appendChild(newElement);

    var audioType = supportedAudioFormat(newElement);
    if (audioType == "") {
        alert("no audio support");
        return;
    }
    newElement.setAttribute("src", "lander/sounds/" + soundName + "." + audioType);

    console.log("loading sound " + newElement.src + "...");

    return newElement;
}

和...

function assetLoaded() {
    var assetName = this.src;

    numAssetsLoaded++;

    console.log("loaded asset " + numAssetsLoaded + " (" + assetName + ")");

    if (numAssetsLoaded >= numAssetsToLoad) {
        shipSpriteSheet.removeEventListener("load", assetLoaded, false);
        pointImage.removeEventListener("load", assetLoaded, false);

        thrustAudioElement.removeEventListener("canplaythrough", assetLoaded, false);
        explosionAudioElement.removeEventListener("canplaythrough", assetLoaded, false);
        victoryAudioElement.removeEventListener("canplaythrough", assetLoaded, false);
        musicTrackElement.removeEventListener("canplaythrough", assetLoaded, false);

        gameState = GAME_STATE_INIT;
    }
}

如果你看看控制台输出，你会看到所有的声音开始加载（特别explode1.mp3），但不一定完成，并呼吁assetLoaded ...

更新：
似乎已经达成共识，就是我不应该使用mp3（顺便说一句，我已经在使用mp3，AAC和AND ogg，但默认为mp3），而且我应该使用Web Audio API。 这些都是值得欢迎的输入，我将进行必要的更改。 但是，我仍然没有原始问题的答案，即“为什么一个声音无法在桌面上可靠地加载而其他声音却没有问题？” 有人想对那一个进行破解吗？ 还是答案会像是“这些事情是高度不可预测的，除了切换到更可靠的方法（如Web Audio API）之外，没有其他方法可以解决此问题”？

UDATE：
这是我的app.yaml文件的摘录，我收集该文件有助于GAE设置服务器。

- url: /(.*\.(mp3|ogg|wav))
  static_files: \1
  upload: (.*\.(mp3|ogg|wav))

Answer 1

要注意的一些事情：

• 您不应将MP3用于HTML5游戏 。
• 您将需要将所有声音双重编码为​​AAC（.m4a）和Ogg Vorbis（.ogg），以确保它们可以在任何地方播放，因为没有一种格式可以在所有地方播放。
• 您必须确保服务器对音频文件具有正确的MIME类型。 如果服务器说MIME类型错误，则某些浏览器会很乐意播放音频。 其他人会默默地失败。 对于AAC和Ogg Vorbis，类型分别为audio / mp4和audio / ogg。
• 大多数移动设备一次只能播放一种声音，而iOS通常不允许您播放音频，除非它处于用户启动的输入事件（例如touchstart ）中。
• 您可能想要使用受支持的Web Audio API（Chrome和iOS 6+），因为即使在iOS上，回放也更加可靠且具有复音性-但请注意，iOS仍会静音Web Audio API，直到用户输入事件为止 。

Answer 2

这不是您不能播放声音的问题的直接答案，而更像是您应该如何处理游戏音效。

对于游戏音效，我建议您使用HTML5 Web音频API，该API可以更好地控制声音的播放方式（音效的音高，播​​放延迟的减少等）：

http://www.html5rocks.com/zh-CN/tutorials/webaudio/intro/

• iOS 6+支持Web Audio https://developer.apple.com/technologies/ios6/

• FF尚不支持Web音频，但即将提供支持