Question

好的，my new website刚刚上线，通过Google Apps提供。在云雀中，我决定加入一个javascript / HTML5 Lunar Lander克隆（Martian Lander），我曾经作为练习写了一段时间。当我在本地打开它时游戏工作正常，但是当它通过GAE传送时，声音似乎并没有加载到每个系统上。在移动版Safari中， none 加载。在桌面上的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，和ogg，但默认为mp3），而且我应该使用网络音频API。这些都是受欢迎的输入，我将进行必要的更改。但是，我仍没有原始问题的答案，即“为什么一个特定的声音无法在桌面上可靠加载，而其他声音加载没有问题？”那个人想破解那个？或者答案是这样的，“这些事情是高度不可预测的，除了转换为更可靠的方法，如Web Audio API之外，没有办法解决它？”

UDATE：
以下是我的app.yaml文件的摘录，我收集了该文件，帮助GAE设置服务器。

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

Answer 1

有些事情需要注意：

你shouldn't use MP3 for HTML5 games。
您需要将所有声音双重编码为AAC（.m4a）和Ogg Vorbis（.ogg）以确保它们可以在任何地方播放，因为没有一种格式可以在任何地方播放。
您必须确保您的服务器具有正确的音频文件MIME类型。如果服务器说它的MIME类型错误，有些浏览器会很乐意播放音频。其他人会默默地失败。对于AAC和Ogg Vorbis，类型分别是audio / mp4和audio / ogg。
大多数移动设备一次只能播放一个声音，iOS通常不允许您播放音频，除非它在用户启动的输入事件中（例如touchstart）。
您可能希望使用支持的网络音频API（Chrome和iOS 6+），因为即使在iOS上播放也更加可靠和复音 - 但请注意iOS仍为mutes the Web Audio API until a user input event。

Answer 2

这不是你的问题的直接答案，为什么没有播放声音，更像是你应该对你的游戏音效做什么。

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

http://www.html5rocks.com/en/tutorials/webaudio/intro/

iOS 6+支持网络音频https://developer.apple.com/technologies/ios6/
FF尚不支持网络音频，但支持即将到来

HTML5 MP3 <audio>无法正确加载</audio>

2 个答案: