尝试播放通知声音时状态 503

Question

我为我们公司创建了一个 PHP/Ajax WebChat。每当收到新消息时，它应该使用第一个答案中的方法播放通知声音。

How to play a notification sound on websites?

现在的问题是，当从任何普通计算机访问它时它工作正常，但是从（相当受限的）公司网络它在控制台中给我一个 "HTTP Status 503 Service Unavailable"。因为它在任何其他 Internet Access 上工作，所以这很奇怪。另外一点，我收到通知声音来自：https://notificationsounds.com/

如果从公司网络进入，有的声音播放有的不播放。刷新后，有效的声音与刷新前不同。就像它随机播放声音一样。注意：聊天服务器位于我家。

可能是什么问题，是否有任何一种不必使用其他 post 方法的变通方法？

这是我用来加载和播放通知声音的代码：

chat.playSound("the-calling");  

playSound : function (filename) {
    document.getElementById("sound").innerHTML=
       '<audio autoplay="autoplay">
            <source src="https://notificationsounds.com/soundfiles/a516a87cfcaef229b342c437fe2b95f7/file-sounds-1068-the-calling.wav" />
            <source src="https://notificationsounds.com/soundfiles/a516a87cfcaef229b342c437fe2b95f7/file-sounds-1068-the-calling.ogg" type="audio/ogg" />
            <embed hidden="true" autostart="true" loop="false" src="/sounds/' + filename  +'.mp3" />
        </audio>';
}

Answer 1

网站 http://notificationsounds.com 实际上并不是用来存放声音的；他们在每个声音上提供 "Download" link 以便您可以主持自己。他们的站点实际上可能无法扩展以满足您对其提出的需求，或者他们可能受到 IP 地址的限制。当您每次想要播放声音时都会访问他们的网站，并且这可能会乘以您在聊天应用程序中拥有的并发用户数，这两种情况都会导致随机失败。

如果站点管理员注意到您公司的 public IP 地址导致此类问题，他们可能会选择阻止您公司的 IP 地址，让您完全无法发出声音。几年前我也发生过类似的事情，正因如此，我终于有机会见到我所在组织的副总裁，并在他的办公室度过 'quality time'。

所以，我推荐两件事：

1) 从他们的网站下载您想要的声音并将它们托管在您的网站上

2) 缓存音频的加载，这样您就不必重新加载它了。

我创建了一个缓存音频的演示（来自 http://notificationsounds.com）：

var notification_sounds = {
    "breaking-glass" : "8f121ce07d74717e0b1f21d122e04521/file-4f_glass-beaking-2",
    "the-calling" : "a516a87cfcaef229b342c437fe2b95f7/file-sounds-1068-the-calling",
    "ringo" : "5737c6ec2e0716f3d8a7a5c4e0de0d9a/file-47_oringz-pack-nine-01"
};

function findOrCreateAudioPlayer(filename) {
    var sound = notification_sounds[filename] || notification_sounds['breaking-glass'];
    var player = $("#audio-" + filename);

    if (player.length == 0) {
  player = $("<audio />").attr("id", "audio-" + filename);
        $("<source />").attr("src", "https://notificationsounds.com/soundfiles/" + sound + ".mp3").appendTo(player);
        player.appendTo($("body"));
        $("<p />").text(filename).appendTo($("body"));
    }
    
    return player;
}

function playSound(filename) {
    findOrCreateAudioPlayer(filename);
    player = $("#audio-" + filename)[0];
    player.load();
    player.play();
}

var sounds = ["nothing", "the-calling", "ringo", "breaking-glass"];
var sound = sounds[Math.floor(Math.random()*sounds.length)]

playSound(sound);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

您也可以尝试 complete jsFiddle demo。

设置好后，您可以通过调用 playSound(soundName) 播放您选择的任何声音（从声音列表中）。该演示会选择一种已注册的声音（和一种未注册的声音），并在您单击代码下方的 'Run code snippet' 按钮时播放该声音。

请注意，这不依赖于任何特定的 HTML 内容，但会根据需要创建它自己的 <audio> 元素，并在其中缓存内容。在此代码中，您会看到一旦声音被缓存，它就不会再次从源站点加载，直到您重新加载页面。

根据您的原始示例，您可以将 playSound 回调更改为：

playSound : function (filename) {
    playSound(filename);
}

稍微更改一下名称可能是明智的，以免造成混淆。

尝试播放通知声音时状态 503

Status 503 when trying to play notification sound

html

javascript

http-status-code-503

html5-audio